Brian Richards: How I created WPBingo using Vue.js, Tailwind CSS, and the WP REST API
I think I'm going to go ahead and get,started because we've got a lot of cool,information to talk about and a very,small amount of time in which to talk,about it,so I'm gonna show off some code samples,and a bunch of different things you're,gonna be compelled to write them down or,ask me what was on there don't worry,my slides are already online and you can,have all of them and the link is at the,end normally give it out at the,beginning and I realize I spoil all the,prizes by doing that so just sit tight,we're gonna ride this together I'm gonna,psyche well I'm AWP bingo calm using the,REST API and view Jas and tailwind CSS,and a whole bunch of other stuff have,many of you been playing,WP bingo so far show of hands no well,you can follow along and demo it you can,go to WP bingo calm right now and it,should load up super quick even if the,Wi-Fi dumps out and we'll talk about how,that works,and this came about because I kind of,like to create little disruptions in,events,I actually really like to create,disruption and before we get into all of,that though I want to talk about what,this talk is not this is not how to make,a production scale ready view J s app,start to finish I'm not going to show,off like code samples that you're going,to want to use in your next,implementation and we're not talking,about lots of best practices we're,talking about building fun things and,growing our knowledge and how to get,from here to being able to make,something like this in a production,ready environment and charge lots of,money for it ideally so this all came,about from a simple idea my wife and I,like to visit Disney World and we also,like to people watch and so we started,just tracking the the patterns and,trends that we would see as we're,watching people in this giant theme park,and I created a list in Evernote just a,bulleted list of all these weird things,we see like a pack mule stroller where,someone has a stroller but no children,Australia was just loaded with luggage,and they're just carting it around the,theme park a tent,from a toddler who has just had it like,they're done the day is spent and other,funny things like this we started making,a nerd note and I thought wouldn't this,be more fun to play with friends forever,than just the two of us just referencing,this Evernote note and what would happen,is we would just be walking through the,parking like bingo bingo as we'd see,these funny things and I was looking for,an experience something that I could,experiment with some new technologies,and I figured a bingo board is a really,great way to figure out some new,JavaScript Tech play around some CSS,things that I've been looking at plus,once I've made it it's highly adaptable,so it's not just going to be theme park,bingo I can turn it into word camp bingo,and I did precisely that at wordcamp us,in fact that's where this photo came,from this was Matt's stated the word,address and people were playing bingo,during the state of the word and we,started offeri
Let's move on to the first section of Wpbingo Framework theme shopify
WordCamp US 2019 - Room 230 - Friday 2
WordCamp US 2019 - Room 230 - Friday 2
...,: ...,: Test test test test test,This is Norma testing the YouTube feed.,Ing,Cory,Moderator: Good afternoon, everyone! How y'all doing?,You are here for what's going to
be, I ,know, a fantastic session, right before we head over into ,lunch. Just a few notes about that.,Lunch is downstairs, follow the group, because I'm sure you'll ,see everybody kind of running in
that direction. It is ,buffet-style. From what I understand that the dietary ,needs are going to be assigned at each station, so just pay ,attention to the various cards at the buffet line for lunch.,Kosher, halal meals, you can see
a uniformed catering staff ,member and they'll be able to help you out with those, and if ,there's anything else that ,you need lunchwise just find one
of the volunteers, they will ,help you out. And then at 1 p.m.,we'll all regroup back in this room, ,Brian Richards' talk will be happening then.,Just a gentle reminder tonight is after the day is WordFest. ,That's at the City Museum which I hear it an amazing venue and ,that's going to be starting at 7:00.,You do need your badges to enter, so please don't forget ,them. So we hope to see you all there tonight.,Now, on to more important things, the ,next talk is going to be by,Kori Ashton.,She started her first company at
age ,12, and has had an entrepreneur's heart ever since.,She built her first HTML website
in ,1998, and was instantly hooked on web,design. In 2012, she launched a
WordPress development firm which,now has 15 employees and is ranked third in the city. She ,also hosts a weekly give-back to
the WP community on her growing ,YouTube channel, which is YouTube.com YouTube.com/kori ,Ashton. Kori is determined to share actionable takeaways to ,our diverse community in every workshop or webinar, her talk is,called, a mom, a lesbian, and an
entrepreneur walked into a ,WordCamp. Ladies and gentlemen, Kori Ashton.,Kori.,: Way to go. Hay y'all.,Thanks for being here with me today. I'm excited that you're ,passionate ,hopefully about the tame topics that I am which is diversity in ,our beautiful culture.,So we're going to lock into some
ideas about how we can continue ,to grow this participation, because even with your ,presence here today today it shows me, so yeah, a mom, a ,lesbian, and an entrepreneur walk into a WordCamp.,I thought this would be edgy enough to get the attention of ,those accepting applications. It
sounds like a start of a joke, ,but it's not, it's actually my life. It's when I walk into the ,building, I walk into the room, this is me, I am a mom, I have ,two handsome little boys, ,they are five and three years old, they are my joy, they're ,crazy and constantly full of energy, so much fun, Andy and ,Ethan, they are amazing little human beings. I am an ,entrepreneur. As shared in my bio, I started at age ,of 12, I'm blessed to be surrounded by an incredible ,community back in San ,Antonio, my mom and dad helped me start my company back in 2012,as an WordPress agency and I'll share
After seeing the first section, I believe you have a general understanding of Wpbingo Framework theme shopify
Continue the next second section about Wpbingo Framework theme shopify
Laravel API Development & Vue JS SPA - e03 - Tailwind CSS
Laravel API Development & Vue JS SPA - e03 - Tailwind CSS
welcome to level API development with,view Jas single page application from,scratch,the following episode is going to be an,excerpt from the full course now,available on udemy if you are interested,in developing robust,laravel api's with a front-end built on,view and tailed when CSS then this is,the course for you we go into great,detail talking about things like,authentication testing tailwind CSS view,j/s levo PHP unit and so much more so I,hope you'll join me for the full course,go ahead and click on the link in the,description to get sent to the udemy,page where you can purchase the full,course I hope you enjoy this episode now,that we have some routing in place let's,start taking care of our front-end and,specifically we're going to pull in the,tailwind CSS library to do that let's go,ahead and visit the tailwind CSS comm,website and let's go ahead and follow,the installation instructions click the,getting started button and first and,foremost of course npm install is,required so let's go ahead and run that,command now back in our project simply,paste that command in and this is going,to add tailwind CSS as a dependency,however this is not enough we still need,to add this to our CSS file and what,these three commands will do is it will,actually bring in the three tailwind,components into our CSS file let's go,ahead and copy these three commands head,back to phpstorm and then this is going,to go inside our app dot s CSS file this,is the file that got emptied out,whenever we use the preset none so now,it's time for us to fill it back up with,some tailwind classes so we have the,three tailwind classes but we're still,missing a couple more steps so let's,keep scrolling down and the first thing,we need to do is create a config file,now the way tailwind works is of course,it's got a bunch of defaults and they're,all fantastic but if you need to,customize something that's where the,tailwind config file comes into play so,to create a default one we simply run,this command in our terminal now notice,here that this has n px and not NPM so,keep that in mind when you are running,this command so we'll run that,and that will add a tailwind config that,j/s file right in our projects root,directory so let's go back to phpstorm,if we scroll down here sure enough here,it is tailwind dot config AS and it's,empty and that's okay as we progress our,project any customizations that we need,for tailwind will actually get added,into this config file so it's good that,we have a default one already in place,the last thing we need to do is of,course let web pack and mix know about,tailwind there's a section specifically,on laravel mix so if we scroll down here,a little bit,there's this last section here for sass,right and this is what we are using,right now so this is the one that we are,interested in let's go ahead and copy,this and we'll bring that into the web,pack mix file and that file is right,underneath the Tailwind config file and,right now all it's doing is co
Congratulation! You bave finally finished reading Wpbingo Framework theme shopify and believe you bave enougb understending Wpbingo Framework theme shopify
No difficulty
