Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/fullstackreact/30-days-of-react
30 Days of React Content and Source Code
https://github.com/fullstackreact/30-days-of-react
30-days-of-code code-examples fullstackreact react reactjs tutorial
Last synced: 6 days ago
JSON representation
30 Days of React Content and Source Code
- Host: GitHub
- URL: https://github.com/fullstackreact/30-days-of-react
- Owner: fullstackreact
- Created: 2017-01-09T23:05:23.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2023-10-09T07:18:29.000Z (about 1 year ago)
- Last Synced: 2024-12-20T20:03:55.161Z (13 days ago)
- Topics: 30-days-of-code, code-examples, fullstackreact, react, reactjs, tutorial
- Language: JavaScript
- Homepage: https://www.fullstackreact.com/30-days-of-react/
- Size: 33.7 MB
- Stars: 2,182
- Watchers: 64
- Forks: 655
- Open Issues: 158
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- Awesome-Clone - 30-days-of-react
README
![](https://www.fullstackreact.com/assets/images/30days/30-days-of-react-header.jpg)
30 Days of React
✨ An Introduction to React - in 30 Bite-Size Morsels ✨
Written by Fullstack.io and friends
# 🚀 Introduction
Over the next 30 days, we'll walk through everything you need to know to work with React. From the very beginning through testing and deployment of our first app.
This repository contains the entire source and content for the article series of [30 Days of React](https://www.fullstackreact.com/30-days-of-react) hosted by the [Fullstack React](https://www.fullstackreact.com/) team.
## 👀 What's inside?
What is React?|
What is JSX?|
Our First Components|
Complex Components|
Data-Driven|
| :---: | :---: | :---: | :---: | :---: |
|
State|
Lifecycle Hooks|
Packaging and PropTypes|
Styles|
Interactivity|
|
Pure Components|
create-react-app|
Repeating Elements|
Fetching Remote Data|
Introduction to Promises|
|
Displaying Remote Data|
Client-side Routing|
Introduction to Flux|
Data Management with Redux|
Redux actions|
|
Redux Middleware|
Introduction to Testing|
Implementing Tests|
Testing the App|
Better Testing with Enzyme|
|
Integration Testing|
Deployment Introduction|
Deployment|
Continuous Integration|
Wrap-up and More Resources|
## 👩🏫 How to use this repository
Each day contains a full React application, following the same procedure used to create the article series. Most days can be run using the same basic steps (and for the days that require a bit more work, check out the tutorial series on the blog).
The steps run any _30 Days of React_ project are:
We can run these steps using the following commands:
```bash
# install the dependencies
yarn install# start the project
yarn start
```Since all of the days are built using the fantastic [create-react-app](https://github.com/facebookincubator/create-react-app) tool, all of the commands are available from that project in every day.
## Contributors
|
Ari
|Nate Murray
|Peter Ho Yeung Chan
|Aaron
|
| :---: | :---: | :---: | :---: |---
# Fullstack React Book
This repo was written and is maintained by the [Fullstack React](https://fullstackreact.com) team. In the book we cover many more projects like this. We walk through each line of code, explain why it's there and how it works.
_30 Days of React_ covers only the early basics of React. If you're looking to learn how to build real-world React apps, including libraries from the React ecosystem, there's no faster way than by spending a few hours with the Fullstack React book.