0% completed

All LessonsFree Lessons (2)

Introduction

Course Overview Who Is This Course For?

The Setup

Full-stack Python

Quiz on the Transcrypt Setup

Write a “Hello, World” Application

A Few Things to Note Hello, World!Coding Challenge Quiz on Our “Hello, World” Application Summary

JavaScript Functions

Random Numbers Coding Challenge Quiz on JavaScript Functions Summary

Sourcemaps

Debugging Console Quiz on Transcrypt’s Sourcemaps Summary

External JavaScript Libraries

Working with jQuery Coding Challenge Quiz on External JavaScript Libraries Summary

Intro to React

React Basics React State Coding Challenge Quiz on the Basics of React Summary

React Concepts

Document Object Model React's Building Blocks More React Concepts Coding Challenge Quiz on React Concepts Summary

Cleaner Code

Break It Up Coding Challenge Quiz on Cleaner Code Summary

Managing JavaScript Packages

NPM Using Local JavaScript Libraries Quiz on Managing JavaScript Packages Summary

Package Bundler

Parcel Simplified JavaScript Imports Build Scripts Quiz on Package Bundler Summary

Text Input

Introduction Handling Input Coding Challenge Quiz on Text Input Summary

Lists

HTML Lists List Component Coding Challenge Quiz on Lists Summary

Forms

Form Action Quiz on Forms Summary

React Components

Introduction Adding Functionality Adding More Functionality Decomposition Coding Challenge Quiz on React Components Summary

JavaScript Examples

To-do List Class Components to Functions Functions Ternary Statements & Dictionaries Spread Operator & JSX JavaScript Imports Putting It Together Quiz on JavaScript Examples Summary

CSS

Stylesheet Inline Styles Styled Components CSS Framework Coding Challenge Quiz on CSS Summary

Material-UI

Introducing Material-UI Optimized Imports & Theming Styled Components Revisited Coding Challenge Quiz on Material-UI Summary

Parcel Web Proxy

Flask Web Server Proxy Service Coding Challenge Quiz on Parcel Web Proxy Summary

Asynchronous Requests

Synchronicity Async/Await Coding Challenge Quiz on Asynchronous Requests Summary

React Context Hook

Nested Components Context Variables Coding Challenge Quiz on React Context Hook Summary

Transcrypt Miscellany

Standard Library & Built-in Functions Keyword Args & Immutability Truthiness & Types Quiz on Transcrypt Miscellany Summary

Application Versioning

The npm Version Application Version Quiz on Application Versioning Summary

Google Analytics

ReactGA Request Timing Quiz on Google Analytics Summary

Developer Tools

Bundle Visualizer Chrome Extensions Quiz on Developer Tools Summary

Appendix

Appendix Notes for Windows Users

Using the Python Transcrypt Transpiler for Front-end Coding/

...

/

React

React

Let’s start with an understanding of React.

We'll cover the following...

Front-end web frameworks
Programming styles

Front-end web frameworks

There are several front-end web frameworks and libraries that currently dominate the web development landscape like:

Vue
Angular
Ember
React

React uses a component-based architecture and can quickly and efficiently update the UI elements in the web browser as the state of ...