WATCH THIS IF YOU WANT TO BECOME A WEB DEVELOPER! - Web Development Career advice LearnCode.academy 2026-09-22 | WATCH THIS IF YOU WANT TO BECOME A WEB DEVELOPER! - Web Development Career advice
Build Wordle in 20min with React.js! LearnCode.academy 2022-04-27 | Using the right React.js stack makes a world of difference in web development! In this video, we'll use Next.js, React.js, Tailwind CSS, and MobX to build Wordle from start to finish in right around 20min. (ok, mildly deceptive, 20min edited...it took me an hour to build it)View the source code here: github.com/learncodeacademy/wordle-reactNext.js allows us to build a web app immediately with no bootstrapping.Tailwind CSS allows us to add styles to our page with no configuration and quick, modular results.MobX gives us a simple way to define our data in a store fashion and keep it separate from our view layer.
How to code in 30min - FOR ABSOLUTE BEGINNERS LearnCode.academy 2022-03-07 | Learn coding fundamentals in mere minutes! This video will teach you about the three main components that nearly all computer programming shares: variables, flow control (a.k.a. control flow), and functions. And we'll do it in Javascript - the world's most popular programming language.This Javascript tutorial will combine es6 variables, flow control statements, and functions to teach any beginner how to code and how to program with a computer language.
How to code in 2022 - From zero to career-level LearnCode.academy 2022-02-28 | Wanna code - and get paid for it? Here's the roadmap! This video gives you the complete checklist of everything you need to know to go from absolute beginner to hired-professional in Web Development. Web Development is about learning html, css, & javascript and building web applications with those technologies.View the checklist here https://www.learncode.academy/webdev
Tailwind CSS - why CSS utility classes save so much time LearnCode.academy 2021-07-09 | CSS utility classes are AMAZING. They save incredible amounts of time when both building and maintaining frontend code - ESPECIALLY in React/Vue/etc JS frameworks. Tailwind is a great CSS utility class framework that makes CSS fun again.Tailwind.css provides you with thousands of utility classes for nearly anything you would normally write CSS for in your HTML, CSS, & Javascript web development. These classes allow you to write style right in the markup and never have to worry about managing stylesheets.Utility classes really shine when you use them in javascript frameworks like React.js, Vue.js, etc. It allows you to copy/paste your component HTML and move it around freely with CSS always "just working".
Manage React state like a boss with MobX Local Observables LearnCode.academy 2021-06-21 | MobX Local Observables are the ticket to happy state management, fast development speed, easy testing, and nearly all the benefits you'd get from using a state management solution like Redux ...without all the nasty ceremony and slowdowns that come from developing with Redux.This React.js + MobX tutorial covers how to use MobX with React to make your React web development fast and simple, easy to reason about as new coders join the project, and easy to test for app stabililty.React.js state management can be quite a pain, so getting it right - especially at the beginning of a project - is key. I encourage any developers to default to MobX local observables for their state management with React.js-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Next.js + React.js tutorial - YOU REALLY should be using Next.js LearnCode.academy 2021-06-11 | Next.js should be your go-to for any React.js work these days. If you're using Create React App...STOP! You're missing out on the joys of Next.js.This tutorial covers Next.js for building React.js apps, websites, blogs. Almost web development you do with React will benefit from Next.js.Next.js is perfect for building an SPA (single page app) with React.Next.js is an amazing SSG (static site generator).Next.js is a great node.js server for your frontend UI....there's almost nothing Next.js isn't great for.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Web Development in 2020 - A complete roadmap LearnCode.academy 2020-01-28 | EVERYTHING you need to learn Web Dev or keep your skills current in 2020! This curated list covers beginning web development all the way through advanced development.View this roadmap here: https://coggle.it/diagram/XfeRbWj7xy3dsEX8/t/web-development-in-20201:06 basic frontend3:50 recommended deployment platforms5:15 no matter what route you take next7:27 advanced frontend18:40 backend25:27 devopsIf you take my recommendation, you'll take this track:- learn basic frontend- learn command line, SSH, and GitHub- learn Parcel, SASS, React, and Webpack- move to fullstack/backend and learn node.js, postgres, redis, go- move to devops and learn docker, terraform, circleCI, digitalocean, awsThat right there, folks, gives you an AMAZING skillset!Hopefully you find this web development tutorial, web dev roadmap, whatever you want to call it extremely helpful in learning web development in 2020. I know these little pieces of web dev information surrounding javascript, databases, etc all took years to stumble across for me personally.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Ultimate Hacking Keyboard UHK60 - Mechanical Keyboard Review LearnCode.academy 2019-12-13 | My honest, unpaid review of https://UltimateHackingKeyboard.com/ - a split-or-not mechanical keyboard that I recently got my hands on!The Ultimate Hacking Keyboard UHK60 from https://UltimateHackingKeyboard.com/ is a 60% mechanical keyboard with a bunch of extra options and cool features that set it apart.It has layers as you would expect from a 60% mechanical keyboard allowing you to do everything you need to do from the home row. 2 buttons below the space bar also allow for easy switching of layers without making dedicated keys for it. Also included are tenting pegs for split keyboard tenting. Lastly, wooden palm rests are included as an option on this mechanical keyboard.This mechanical keyboard review is unbiased, hasn't been paid for, and, most importantly is made on the basis of using this keyboard for over a month straight. This mechanical keyboard has kailh brown keyswitches and blank keycaps.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
ArangoDB Tutorial - Databases every developer should know about LearnCode.academy 2019-08-07 | ArangoDB (arangodb.com) is a SUPER COOL database that every developer should at least be familiar with. ArangoDB is muti-model, so you can use it as a document DB, a key/value store, or a graph DB all at the same time.ArangoDB has a TON of flexibility and features, ranging from GeoJSON, search views (arangosearch), the ability to add node.js microservices, and, best of all, a really nice query language.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
CSS Units - Which ones to use and which to stop using! - HTML CSS Tutorial LearnCode.academy 2019-07-23 | Don't guess, know when to use px, %, rm vs em, fr, ch, vw, vh and more...CSS gives you a LOT of options and each is there for a purpose.SPECIAL THANKS to twitter.com/chaddonohue for peer reviewing this content!In this tutorial, we'll cover all the CSS units, and, most importantly, which ones to use (and which NOT to use) for which situations.In web development, css units are often confusing as there are just many options. And, many css units - like px vs em vs rem, all seem to get the job done at times. But some are simply better than others and there are very good reasons why.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
How To Make A Website From HTML & CSS - FAST, CHEAP, EASY LearnCode.academy 2019-05-28 | In under 10mins, turn your HTML and CSS into a website!Domain Registration: iwantmyname.com bit.ly/2DFNal0The hosting plan I recommend: partners.hostgator.com/qo7dqHostGator coupons!LETSMAKEADEALDROP10BUCKSDROP25PERCThe full course on building a website:youtube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGAB_8_iq1cL8MVeun7cB6eNcIf you know how to code with HTML and CSS, then the last step of getting your website online is the easiest part. All you need to do is register a domain, then point that domain to a webhost.Hostgator is the best, easiest webhost for new coders...they make everything completely simple and your site is up in mere minutes. Hostgator shared web hosting is also really inexpensive and their 24/7 support is a huge help for new coders.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
LearnCode.academy Live Stream LearnCode.academy 2019-04-05 | -~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Responsive Design Tutorial - Tips for making web sites look great on any device LearnCode.academy 2019-02-26 | There are a few "gotchas" to responsive design, and once you know them, the rest all makes sense.Play with the code!!!codepen.io/anon/pen/oVNBEX?editors=1100View the full course!!!youtube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1GSuper helpful links on responsive images:medium.freecodecamp.org/a-guide-to-responsive-images-with-ready-to-use-templates-c400bd65c433developer.mozilla.org/en-US/docs/Learn/HTML/Multimedia_and_embedding/Responsive_imagesResponsive Design makes a website look amazing on any device. Using css media queries, good flexbox/grid layouts, srcset, and html5 picture tags, we can convert our website into a fully responsive site.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
HTML & CSS Tutorial - Ways to code images...and how to do it well LearnCode.academy 2019-01-21 | Here's how to properly code images into your webpages without making them fuzzy on hi-res devices like the latest iPhone.Play with the code!!!codepen.io/anon/pen/wOvgde?editors=1100View the full course!!!youtube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1G There are 2 ways you'll add images to your website:- html background images (use this if the image is a part of the design- html content images (use this if the image is a part of the content)The method for adding html & CSS images is different for each type of image.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
MOST AMAZING ERGODOX YET! - ERGODOX EZ GLOW REVIEW w/ Kailh Copper keyswitches LearnCode.academy 2018-12-06 | My absolute favorite keyboard got an upgrade! I'm unboxing the latest ergonomic mechanical keyboard from Ergodox EZ and it GLOWS!It's here: http://ergodox-ez.comThe Ergodox EZ keyboard has been my daily driver keyboard for a while now and I'll never go back. I've used it with gateron browns for a while now, and now they offer it with Kailh keyswitches. The one I'm opening has Kailh copper keyswitches. Compared to Cherry MX keyswitches, the Kailh copper keyswitches are very different, they almost feel like Matias Quiet Click keyswitches, which are my favorite keyswitches of all time.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
CSS SELECTORS MADE EASY - HTML CSS Tutorial for Beginners LearnCode.academy 2018-12-06 | You won't get far in web dev without understanding CSS selectors, and they aren't hard at all!Play with the code! codepen.io/anon/pen/BGeKVMView the whole Web Development Tutorials for Beginners playlist! youtube.com/playlist?list=PLoYCgNOIyGABDU532eesybur5HPBVfC1GUsing CSS selectors are the bread and butter of HTML and CSS coding. You have to think about what elements on your page you want to target and how to write rules that cleanly target and apply css styling to those elements.2 good rules you always want to follow: don't make rules more specific than they have to be (but also don't make them overly generic like "target every div on a page"), and also don't repeat yourself (DRY).-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
HTML CSS TUTORIAL FOR BEGINNERS - multiple pages LearnCode.academy 2018-11-29 | Setting up multiple pages in HTML + CSS is easy, there are just a few gotchas to be careful of! VIEW THE CODE: next.plnkr.co/edit/PKoGCHFcccpCoIIxYou'll start by creating multiple HTML pages. They can be in the same folder, or in their own folder, it doesn't matter, you just need to know where to point to them. Then, you simply make A tags to point to them. In HTML, when referencing a file, beginners tend to make 2 mistakes - they don't spell the file name right (or use capital/lowercase letters on accident) OR, they don't point to the right location for the HTML/CSS file. If the HTML or CSS file is in a folder, you need to reference the folder as well.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Flexispot Standing Desk Review - And Why You Need a Sit Stand Desk! LearnCode.academy 2018-11-26 | Standing Desks are AWESOME, and a must-use for developers or anyone working at a computer all day. I've been using a stand up desk for 4 years and finally got my hands on a Flexispot E5 http://bit.ly/2OTJMa6 for review.The Flexispot E5 sit stand desk is a great middle of the road standing desk with awesome features, a great warranty and a good price for what you get. This Flexispot review is unbiased and I give my honest opinion for what you get with the desk.Flexispot also offers a large assortment of ergonomic workspace products - the varidesk, the desk bike, and more-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Build an HTML + CSS Layout with Flexbox in just a few lines of code LearnCode.academy 2018-11-12 | Build a Flexbox grid layout in just a couple lines of code! Getting good with HTML + CSS Layouts gets you very far, very fast with web development.Watch this full course!: youtube.com/playlist?list=PLoYCgNOIyGABDU532eesybur5HPBVfC1GBuilding an HTML + CSS Layout is the first core skill you learn in web development. Lots of people think it's very hard, but it doesn't have to be. This course of web development tutorials for beginners will show you how to build an HTML CSS Layout, then add content with HTML CSS content blocks, which is where you learn all the tips and tricks it takes to build a website.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
EASY! Hand-code an HTML + CSS layout LearnCode.academy 2018-11-05 | With a handful of tags and a little CSS, you can build a layout completely from scratch! View the Whole Series: youtube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1GPlay with the Code: codepen.io/anon/pen/aQObeP?editors=1100In this web development tutorial for beginners series, we're learning html and css from the very beginning. We'll learn by building a website from scratch rather than doing a separate html tutorial for beginners an css tutorial for beginners.We'll learn about div tags and semantic tags that we can use in the place of div tags to make our html more readable.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
HTML CSS Tutorial for Beginners - Web Development Tutorials For Beginners LearnCode.academy 2018-08-09 | This video makes how CSS works easy to understand...it's just styles added to your page. You can do a lot with them, but at the end of the day, there's very little you have to know about CSS itself to start using it.View the whole playlist of 2018 Web Development Tutorials for Beginners: youtube.com/playlist?list=PLoYCgNOIyGABDU532eesybur5HPBVfC1GVideo 1: Professional setup with VSCodeyoutube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1G&t=23s&index=2Video 2: HTML Tutorial for Beginnersyoutube.com/watch?v=RjHflb-QgVc&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1G&t=4s&index=3-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
HTML Tutorial for Beginners LearnCode.academy 2018-08-01 | Learn HTML FAST from a professional developer. This course will get you into the career of web development. You'll learn HTML, CSS, & Javascript using modern tools so you won't be embarrassed on your first job interview!IMPORTANT! If you ONLY want a website for yourself or your business, DO NOT learn all this stuff...it's a waste of your time.Instead, click here: to go to WIX ADI bit.ly/2LQYBf7. Wix is by far the easiest and cheapest way to get a website up and running without learning the skills of a web developer.Note, that's an affiliate link, so feel free to snoop around on their site to find the Wix ADI on your own if you don't want to support this channel.In this video, we're going to learn how to build a website with HTML.In this tutorial html is the hero and we'll learn just how simple it is to get started...you really only need to learn a few words!The whole course:Web Dev 1: How to set up your computer for web developmentyoutube.com/watch?v=gQojMIhELvM&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1G&index=2&t=0s-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Web Development Tutorial For Beginners - how to make a website LearnCode.academy 2018-08-01 | Learn Web Dev the way professionals do! This FULL course covers it all. We'll learn HTML, CSS, Javascript and the workspace/computer setup that professionals use.IMPORTANT! If you ONLY want a website for yourself or your business, DO NOT learn all this stuff...it's a waste of your time.Instead, click here: to go to WIX ADI bit.ly/2LQYBf7. Wix is by far the easiest and cheapest way to get a website up and running without learning the skills of a web developer.Note, that's an affiliate link, so feel free to snoop around on their site to find the Wix ADI on your own if you don't want to support this channel.This first video will get you setup for how to make a website by first setting up your computer for web development.Next up, we'll learn HTML for beginners, then start baking in CSS to our HTML!youtube.com/watch?v=RjHflb-QgVc&index=3&list=PLoYCgNOIyGABDU532eesybur5HPBVfC1G&t=4s-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Parcel ...the Webpack KILLER?! LearnCode.academy 2018-06-27 | Parcel is AWESOME. And in many, MANY cases, you don't need to haggle with Webpack anymore, which to some developers is a dream come true, because messing with a build system is one of the most painful parts of modern web application development.Example Code: github.com/learncodeacademy/parcel-examplesWebpack Tutorial: youtube.com/watch?v=9kJVYpOqcVUWhy do you need a build system? youtube.com/watch?v=XJ5F-Auhato-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
TensorFlow JS Tutorial - Build a neural network with TensorFlow for Beginners LearnCode.academy 2018-06-19 | In just a few lines of code, we can build and train a neural network with Google's Tensorflow.js. Birthed by Google engineers, TensorFlow is an amazing machine learning library with a great community and LOTS of tooling and visualization resources.Get the source code:gist.github.com/learncodeacademy/a96d80a29538c7625652493c2407b6beThis video walks beginners through the library and helps them understand how to piece together different layers of a neural network to solve iris dataset with machine learning in just a few minutes.Other Videos:Machine Learning Introduction:youtube.com/watch?v=9Hz3P1VgLz4&t=12s&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=2Machine Learning Recommendation Engine:youtube.com/watch?v=lvzekeBQsSo&t=0s&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=3Neural Networks Explained:youtube.com/watch?v=GvQwE2OhL8I&t=443s&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=4Neural Networks Explained Pt 2:youtube.com/watch?v=9ZsyQZouOQ8&t=2s&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=5Machine learning and neural networks are great at solving non linear data that would otherwise be very difficult to solve with standard algorithms.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Neural Networks Explained - Machine Learning Tutorial for Beginners LearnCode.academy 2018-06-11 | If you know nothing about how a neural network works, this is the video for you! I've worked for weeks to find ways to explain this in a way that is easy to understand for beginners.Past Videos:Intro to Machine Learning with Javascript:youtube.com/watch?v=9Hz3P1VgLz4&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=2&t=0sMachine Learning 2 - Building a Recommendation Engine: youtube.com/watch?v=lvzekeBQsSo&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=3&t=0sMachine learning and neural networks are awesome. This video provides beginners with an easy tutorial explaining how a neural network works - what math is involved, and a step by step explanation of how the data moves through the network.The example used will be a feed forward neural network with back propagation. It explains the difference between linear and non linear data, the importance of the activation function, learning rate, and momentum configurations.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Neural Networks Explained Pt 2 - Machine Learning Tutorial for Beginners LearnCode.academy 2018-06-11 | This video builds on the last video and shows an actual neural network training with logs of the biases, weights, and math used along the way.Gist of this console output:gist.github.com/learncodeacademy/8acf7e3a2c4c33100f04c6715c662a01The last video:youtu.be/GvQwE2OhL8IIntro to Machine Learning:youtube.com/watch?v=9Hz3P1VgLz4&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=2&t=0sMachine Learning 2 - Building a Recommendation Engine: youtube.com/watch?v=lvzekeBQsSo&list=PLoYCgNOIyGABWLy_XoLSxTVRe2bltV8GM&index=3&t=0sMachine learning and neural networks are awesome. This video provides beginners with an easy tutorial explaining how a neural network works - what math is involved, and a step by step explanation of how the data moves through the network.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Machine Learning Tutorial - Making a recommendation engine IN THE BROWSER LearnCode.academy 2018-03-28 | In part 2 of our machine learning crash course, we'll make a recommendation engine in the browser.Here's the code! codepen.io/willrstern/pen/WzZqpdWe will make a recommendation engine example that fully runs in the browser with really good performance. Artificial intelligence and machine learning are awesome new frontiers in computing and data science. Web developers can use machine learning and artificial intelligence to solve problems in fun and unique ways.Once we build a trained model using our neural network, we can quickly run thousands of possible options through our model to get ideal recommendations for our users.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Machine Learning Tutorial for Beginners - USING JAVASCRIPT! LearnCode.academy 2018-03-19 | In a few lines of code, we can tackle real browser or server challenges with machine learning and neural networks! Here's the source code:codepen.io/anon/pen/NYRRQm?editors=1111Machine learning is a fun new(er) way to solve problems.Rather than programming an algorithm for answering a question about our data, we instead can train a "neural network" with a set of training data. Once we have a trained network, we can use it to predict outcomes.In this example, we will train a neural network to distinguish between dark and light colors and pick the appropriate color of text to go over the top. To do this without machine learning, there is no single solution that will always get it right (see this blog post 24ways.org/2010/calculating-color-contrast)-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Web Development 2018 - The Must-Know Tech LearnCode.academy 2018-03-13 | A complete roadmap to being a successful web dev in 2018!The mindmap with all of the links: http://bit.ly/2p63dS9Node.js course!: gumroad.com/l/iqGFtJump to a section:- Basic Front End: 2:04- No Matter Which Route You Take: 4:57- Front End Engineer: 7:29- Back End Engineer: 14:42- DevOps: 21:11This video covers everything it takes to be a web developer in 2018. Beginning web development, learning html and css, learning javascript, becoming a front end developer, becoming a back end developer...and even dev ops and docker!If you learn these skills, you'll be an in-demand developer with a modern and powerful skillset.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial #9 - Scaling Vue.js Data with Stores LearnCode.academy 2017-11-21 | GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsKnowing how to scale Vue data is essential, and easily done with Vue.js stores.Vue.js is one of the top 3 Javascript frameworks you should know these days.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial #6 - Full REST Example LearnCode.academy 2017-11-21 | GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsLet's build out a full RESTful example with Vue...and like evertything with Vue, it will be super easy and fast.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial #5 - AJAX data and Lifecycle Methods LearnCode.academy 2017-11-21 | GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorials In this Vue.js Tutorial, we'll load AJAX/XHR data using Vue lifecycle methods. Vue lifecycle methods allow us to take vue components and hook into them at various points for custom behavior.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vuejs Tutorial #8 - Vue Router LearnCode.academy 2017-11-21 | GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsVue Router is how we'll handle multiple "page states". It doesn't take long to set it up and then you can have a single page application running with Vue.js.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue.js Tutorial #7 - Scaling Vue with Single File Components LearnCode.academy 2017-11-21 | GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsNow that we have the basics of Vue.js, let's scale it with a full build system and .vue single-file-components. This is where Vue gets really fun in my opinion.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial #4 - Break up your app into Vue Components LearnCode.academy 2017-10-02 | Vue components allow you to break up your application into smaller, discrete pieces. GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsVue.js is one of the top 3 Javascript frameworks you should know these days.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial #3 - Vue.js directives and event listeners LearnCode.academy 2017-10-02 | Vuejs directives are very similar to Angular.js directives, but are much simpler to use.GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsIn this video, we'll show how to creat event listeners and modify data using Vue directivesVue.js is one of the top 3 Javascript frameworks you should know these days.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial # 2 - Vue.js filters and computed data LearnCode.academy 2017-10-02 | Vuejs filters and computed data are extremely simple, but powerful.GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsIn this video, we'll show how easy it is to use them.Vue.js is one of the top 3 Javascript frameworks you should know these days.The Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Vue Tutorial - Vue JS Tutorial for Beginners #1 setting up an app LearnCode.academy 2017-10-02 | Vue.js is one of the top 3 Javascript frameworks you should know these days. GET THE SOURCE CODE: github.com/learncodeacademy/vue-tutorialsThe Vue framework is extremely simple to learn and fun to use.It's my tool of choice for small widgets and simple apps, but can easily scale to large application development.Vuejs is also the best framework for new JS developers to learn when starting out.Vue.js 1: youtube.com/watch?v=mZY1yyrlJWU&index=1&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 2: youtube.com/watch?v=h6lhOYv-QM4&index=2&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 3: youtube.com/watch?v=t0w2KLOLaTA&index=3&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 4: youtube.com/watch?v=1V9Lcnm1Dqw&index=4&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9Vue.js 5: youtube.com/watch?v=inJDWcHmsss&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=6Vue.js 6: youtube.com/watch?v=Oyr5X5HwXhM&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=5Vue.js 7: youtube.com/watch?v=IkcJ0YAiycQ&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=7Vue.js 8: youtube.com/watch?v=mY2MiaYiSdw&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=8Vue.js 9: youtube.com/watch?v=mS9-fTrgjrA&list=PLoYCgNOIyGADZuvKJweutZDOO9VI9YiJ9&index=9-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Help Me, Im Stuck in Wordpress World! LearnCode.academy 2017-09-18 | This video is designed to help you break into development arenas that CMSs may have been shielding you from.$10 Free digitalocean server credit: http://webdev.willstern.com/digitaloceanThis video is called "help me, I'm stuck in Wordpress world." Now a few things I should point out right away.First of all, you can subsitute any CMS in for Wordpress - Drupal, CraftCMS, and so on.This video is for developers who find themselves stuck in the deadzome of being proficient in a CMS, but feel much less capable outside of one.I personally was stuck here for at least 5 years and I personally know many, many dozens of developers who are stuck here now.So it is very real.Secondly, I have to mention that there is nothing inherently wrong with Wordpress, Drupal, or any CMS.They serve a very important purpose and many top-notch companies need and use them.The problem many developers experience is that when they're learning web development, a CMS helps them get very far very fast through templates and plugins.After a while of developing in a templates-and-plugins world, developers often find themselves in a dead end.They've been shielded from many aspects of development and can't break out of where they are.How Do I Know This is me?: If any or all of these apply to you: - "you're comfortable creating sites in a CMS, but uncomfortable creating sites outside of a CMS" - "you think in terms of hacking/tweaking existing things instead of building new things - e.g. find a calendar plugin and tweak it fit to your needs, find a template and tweak a template, etc" - "when asked to build a backend feature - like a login, a calendar, an email form, social network type of feature - you only know how to do it with plugins" - "if you were asked to make an app like pinterest, facebook, twitter, without a CMS, you'd have no clue where to begin" - "you don't actually know how a CMS works and what it's doing behind the scenes - you have no idea how to begin to build the CMS you're using" If this is you, do not feel bad: - Just be aware of the fact that SO MUCH of the development community know the answers to the questions above...and you should too. - ONE EXCEPTION you consider yourself and want to consider yourself a designer. Your true passion is look/feel, you have no desire to learn development and intentionally stop at HTML/CSS/Maybe-lightweight-JS like jQuery. - In saying that, when I was stuck for those 5 years, I told myself that it was because I was "a designer", when the truth was, all I knew how to be was a designer. I didn't know that I absolutely loved development, because I had never learned it. I was in a box and never knew that I was. Many developers I know were there as well.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Giving away the Das Keyboard 4 Ultimate using Code LearnCode.academy 2017-05-24 | I'm giving away the Das Keyboard 4 Ultimate with this code: gist.github.com/learncodeacademy/fdaabccee54dd3d497a7da4665ec1f98 ....HERE GOES!-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
GIVEAWAY - Das Keyboard 4 Ultimate - A beautiful and well-priced mechanical keyboard LearnCode.academy 2017-04-28 | I'm giving away a beautiful Das Keyboard 4 Ultimate! http://daskeyboard.com (P.S. I get paid nothing from Das Keyboard for this video) Das Keyboard makes some amazing mechanical keyboards that are a pleasure to type on all day. The 4 Ultimate has an anodized aluminum top and Cherry MX keyswitches, which, when combined, makes for an incredible typing experience. The Das Keyboard Ultimate also features blank keycaps to promote more efficient typing (that's right, MORE efficient...because it breaks terrible habits)View the 4 Ultimate at http://www.daskeyboard.com/daskeyboard-4-ultimate-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
[April Fools 2017] ES2018 First Look - it changes everything LearnCode.academy 2017-03-31 | ES2018 a.k.a. "ESSuper-Next" is out and it is awesome.It has powerful new features like always-global-variables, common-keyword shortcuts, dot-syntax,flow/typescript supportIt's sure to be a game-changer.Oh...and by the way, this is an April Fools video :)-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Yarn vs NPM - You wont believe how fast it is LearnCode.academy 2017-03-13 | Yarn is the hot new drop-in NPM replacement utility for projects using node.js packages. It's way faster, more stable, and more secure than NPM and you can use it with zero configuration on your end.In the sample for this video, the NPM install takes between 20 and 30 seconds for just a few packages, while the yarn install takes 4-10 seconds to install all of the node packages. Yarn is also more predictable across environments, so you don't need to npm-shrinkswrap anything, because Yarn manages the dependency tree with a yarn.lock file automatically.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
AWS Lambda Tutorial: Lambda + Serverless = HAPPY LearnCode.academy 2017-02-27 | In under 10 minutes, we'll have a production and staging server running on AWS Lambda using Serverless.This AWS Lambda tutorial shows how powerful functions as a service are and how easy it is to get up and running with them.The Serverless framework helps you get up and running in production in 3 commands. (2 if you already have the AWS CLI installed!)-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
Dev Workflow Tips! - Apps, Keyboard Setup, Editors and More - Ergodox EZ Mechanical Keyboard LearnCode.academy 2017-02-21 | Here's my keyboard:ergodox-ez.comHere's my Ergodox EZ layout: http://configure.ergodox-ez.com/keyboard_layouts/qgmgejIn this video, I show off the new Ergodox EZ Snow and Shine LED edition, which is a beautiful keyboard.When doing web development locally, the go-to apps that I most would miss are Divvy, iTerm2 and Alfred. They make getting around a dev machine incredible.I also use Sublime Text and, more recently, Visual Studio Code.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
From Newbie to Ninja with Node.js - Full Node.js Tutorial Course for Beginners LearnCode.academy 2016-11-02 | http://store.learncode.academy/If you're new to backend or wanting to take on a new language/framework, this is a great course for you. Starting from ground-zero, this Node.js tutorial for beginners covers a complete core-competency skillset in Node.js.node.js basics, databases with node.js, authentication & authorization with nodejs, Redis caching, deployment and more.Recommended Prerequisite Playlists:Javascript for Beginners:youtube.com/playlist?list=PLoYCgNOIyGACnrXwo5HMCfOH9VT05znGvJavascript is Weird and Awesome:youtube.com/playlist?list=PLoYCgNOIyGABI011EYc-avPOsk1YsMUe_Modular Javascript:youtube.com/playlist?list=PLoYCgNOIyGABs-wDaaxChu82q_xQgUb4f-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
DRASTICALLY IMPROVE YOUR WORKFLOW WITH CONTINUOUS DEPLOYMENT LearnCode.academy 2016-09-22 | Let's improve application workflow significantly by adding continuous deployment!HERE'S THE REPO: github.com/willrstern/example-deploymentSEMAPHORE COUPON!: LEARNCODEACADEMY25 gets you 25% off any plan for 3mo on semaphoreci.comContinuous deployment is one of the easiest ways to DRASTICALLY improve workflow for any application. You simply have your continuous integration service of choice run a deploy script against your server. Now, whenever you merge to master, your code is out on production and when you merge on staging, it's out on a staging server. It's an incredible workflow that makes deploying your code manually feel archaic.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
EXTREMELY FAST & SIMPLE CI TESTING - SemaphoreCI LearnCode.academy 2016-08-26 | SemaphoreCI is a great testing platform primarily because it's blazing fast. In just a few seconds, we'll get continuous testing up and running for our Javascript Project!SEMAPHORECI: semaphoreci.comTHE CODE:github.com/willrstern/semtestTHE BLOG POST:semaphoreci.com/community/tutorials/how-to-test-react-and-mobx-with-jestThe #1 thing that I care about with continuous testing is SPEED. I want my tests to start running immediately and be completed very quickly. Enter SemaphoreCI. I'm not entirely sure how they do it, but they run and complete tests incredibly quickly.For this sample javascript app with React and MobX with Enzyme and Jest, it takes 45 seconds on my local mac to run npm install and jest. The first time I run tests on SemaphoreCI, the tests complete in 60seconds, which is incredible. Even more amazing is that the continuous integration tests complete 4 times as fast the second time...in 16 seconds! Continuous integration with SemaphoreCI means that pull requests are flagged as ready-to-merge much faster, which means your workflow is far less hindered.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
MobX tutorial #2 - Computed Values and Nested/Referenced Observables LearnCode.academy 2016-08-17 | MobX is AWESOME. It makes React.js programming fun and it...just...works. Get the code here:GET THE CODE:github.com/learncodeacademy/react-js-tutorials/tree/master/6-mobx-reactTHERE ARE 2 BRANCHES: "master" for where we end up and "start" for where we start.MobX builds on the concept of observable values. When React observes a value, it can automatically update the UI whenever the value changes. This makes programming with MobX and Reactjs extremely simple.All it takes to begin is to install mobx and mobx-react and make sure that you are transforming class properties and decorators in Babel.Now, you simply add @observable to your MobX class and you've successfully built a MobX observable store.To "observe" the store, you pass in a MobX store as a prop and you decorate your React component with the @observer decorator.Voila...you're reacting to store changes in React.-~-~~-~~~-~~-~-Also watch: "Tailwind CSS - why CSS utility classes save so much time" youtube.com/watch?v=oU5ar0dmQEY-~-~~-~~~-~~-~-
