The Beginner’s Guide to React

Speaking of Kent C. Dodds in the previous post: he has updated his The Beginner’s Guide to React on Egghead to include Hooks and the whole lot.

This course is for React newbies and anyone looking to build a solid foundation. It’s designed to teach you everything you need to start building web applications in React right away.

Each lesson in this 28-part course is a single index.html file. This keeps your focus on learning React, no distractions. We’ll start with a blank file and add more complexity as we go along, wrapping the course with a lesson on how to move into a more production-ready development environment—and even deploy your app to a great service like Netlify.

The Beginner’s Guide to React →

Learn about security by hacking a fake bank using a real hacking method

Cool interactive site showing your how to perform a Server Side Request Forgery hack, based on a true incident:

The following interactive tutorial is a reconstruction of Capital One’s data breach incident that exposed the records of almost 106 million customers.

Paige Thompson is accused of breaking into a Capital One server and gaining access to 140,000 Social Security numbers, 1 million Canadian Social Insurance numbers and 80,000 bank account numbers.

To all developers: As always, beware when processing user input …

Contra – Interactive Application Security Training →

Via Jesse

SwiftUI by Example – Free Course on SwiftUI

Paul Hudson, creator of Hacking with Swift:

Yes, that’s a full course on SwiftUI already available online, for free!

Sections include:

  • Introduction: A brief explanation of the basics of SwiftUI
  • Text and Images: Getting started with basic controls
  • View Layout: Position views in a grid structure
  • Reading input: Respond to interaction and control your program state
  • Lists: Create scrolling tables of data
  • Containers: Place your views inside a navigation controller
  • Alerts and action sheets: Show modal notifications when something happens
  • Presenting views: Move your user from one view to another
  • Transforming views: Clip, size, scale, spin, and more
  • Animation: Bring your views to life with movement

Amazing!

SwiftUI by Example →

TIP: Do note that the order of statements in SwiftUI is important:

CSSGrid.io – Free Video Series to learning CSS Grid

Great new video series by Wes Bos, this time on learning CSS Grid.

CSS Grid may seem a bit daunting with new syntax and layout ideas, but it’s fairly simple and can be broken down into a handful of powerful concepts that when used together will blow your mind and change the way you create layouts for the web forever.

Ready?! Let’s Learn CSS Grid Together!

Thanks to a sponsorship by Mozilla Firefox the series – all 25 videos – is entirely free.

CSS Grid — Learn all about CSS Grid with Wes Bos in this free video series! →

Learn React Fundamentals and Advanced Patterns

Kent C. Dodds – whom you should follow on Twitter – has released two massive video courses on Egghead.

Course one touches React Fundamentals:

This course is for React newbies and those looking to get a better understanding of React fundamentals. With a focus on React fundamentals, you’ll come out of this course knowing what problems React can solve for you and how it goes about solving those problems. You will have a good grasp on what JSX is and how it translates to regular JavaScript function calls and objects.

Course two touches Advanced React Component Patterns:

The goal of this course is to give you the knowledge of advanced patterns you can use to make React components that are more flexible, simpler, and more fun to build, use, and maintain. We’ll start with a simple <Toggle /> component which we’ll progressively refactor to each of the patterns so you can see the relative trade-offs of the patterns and how they can be used together to increase the usefulness of your component while at the same time simplifying things for everyone.

They’re free (for now), so be sure to check them out any time soon 🙂

Learn React Fundamentals and Advanced Patterns →

“A-Frame Tutorials” Video Series

Alexandra Etienne has published a 7-part video series on working with A-Frame on YouTube:

A-Frame is a framework for building rich 3D experiences on the web. It’s built on top of three.js, an advanced 3D JavaScript library that makes working with WebGL extremely fun. The cool part is that A-Frame lets you build WebVR apps without writing a single line of JavaScript (to some extent). You can create a basic scene in a few minutes writing just a few lines of HTML.

A-Frame Tutorials →
A-Frame

“Beau teaches JavaScript” — Learn JavaScript with this huge collection of free videos

Beau Carnes has released a massive collection of videos on JavaScript.

My JavaScript Basics course is now live on freeCodeCamp’s YouTube channel. These videos are designed to quickly give you key information on each topic. Also, I designed them to be as modular as possible. They work fine as stand-alone videos, if you just want to learn about a single topic.

Covered subjects, to name a few, are: variables, strings, functions, hoisting, comparators, arrays, loops, objects, … — yes, the whole lot.

And there’s even more:

Besides the JavaScript Basics course, I’ve also developed playlists for ES6, Clean Code, Data Structures, and Design Patterns.

My giant JavaScript Basics course is now live on YouTube. And it’s 100% free. →

JavaScript30 – Build 30 things with vanilla JS in 30 days with 30 tutorials

Great, and free, video course by Wes Bos (whom you really should follow on Twitter).

So, you’ve done a few courses and read a few books but still don’t feel great about your relationship with JavaScript.

How do you get better?

Build things. Lots of things. Build 1,000 things. Keep it up and don’t stop. Seriously.

This is JavaScript30 — let’s build 30 things together.

Always interesting to see how others approach (and solve) a problem. Basic knowledge of JavaScript is required.

JavaScript30 →