React Templates Learning Project

A small Create React App repository containing several focused template components that demonstrate common React concepts: state, effects, context, reducers, custom hooks, forms, data fetching, and styling.

Contents

• src/templates/Counter.js - useState counter example
• src/templates/Todo.js - simple todo list (add/remove)
• src/templates/FetchUsers.js - data fetching with useEffect
• src/templates/SimpleForm.js - controlled form example
• src/templates/ContextTheme.js - React Context provider/consumer example
• src/templates/UseReducerCounter.js - useReducer for predictable state
• src/templates/CustomHookDemo.js - example custom hook (localStorage)
• src/templates/StyledCard.js - inline styling example

Getting started

1. Clone the repository:

git clone https://github.com/jackghx/react.js-basics.git
cd react.js-basics

2. Install dependencies and start the development server:

npm install
npm start

3. Open the app in your browser at http://localhost:3000.

Notes

• This project was created with Create React App and includes source maps, so the original src/ files are visible in the browser DevTools.
• The App component lets you switch between template components located in src/templates.
• Edit or extend the templates to experiment. Hot-reloading updates the running app automatically.

License

This repository contains example code for learning purposes. Use it freely in personal or educational projects.