nonoesp / web-101

⚡️ Introduction to React (and webpack and TypeScript and Electron and maybe more).

React 101

Introduction to React (and webpack and TypeScript and Electron and maybe more).

💾 Requirements

• Git
• Node.js (which comes with npm)
• live-server

📚 Contents

You can see what code changes on each chapter by going to its branch and clicking Compare.

• Code changes from 01-webpack → 02-webpack-config
• Code changes from 02-webpack-config → 03-typescript
• Code changes from 03-typescript → 04-react

🗺 Introduction · Overview

• An quick overview of HTML, SCSS, JavaScript, TypeScript, and webpack.
• nonoesp/laravel-mix-quickstart

📦 Chapter 1 · Webpack

• The simplest webpack application.
• https://webpack.js.org/guides/getting-started/ (Part 1)

⚙️ Chapter 2 · Webpack config

• Customizing webpack's configuration.
• https://webpack.js.org/guides/getting-started/ (Part 2)

⌨️ Chapter 3 · TypeScript

• Adding TypeScript to the mix.
• https://webpack.js.org/guides/typescript/

🦠 Chapter 4 · React

• The simplest React application.
• https://www.typescriptlang.org/docs/handbook/react-&-webpack.html

⚡️ Chapter 5 · Electron (Bonus)

• What is Electron (video) · 4 min
• electron/electron-quick-start
• nonoesp/electron-quick-start
• electron-packager

Hello, Electron!

electron/electron-quick-start is Electron's official quick-start with JavaScript.

# Clone this repository
git clone https://github.com/electron/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies
npm install
# Run the app
npm start

Hello, Electron, React & TypeScript!

nonoesp/electron-quick-start is Nono's quick-start with Webpack, TypeScript, React, Redux, Jest & auto-reload.

# Clone this repository
git clone https://github.com/nonoesp/electron-quick-start
# Go into the repository
cd electron-quick-start
# Install dependencies
npm install
# Run the app
npm start

Author

Hi. I'm Nono. I host Getting Simple—a podcast about how you can live a more meaningfull, creative, and simple life—sketch things that call my attention, and write essays on enjoying a slower life.