- Step by Step Learn React.js and Create Interesting Projects
- Deploy React project with surge.sh
- HTML/CSS
- React
- is developing
# | Date | Project | Live Site | Repository |
---|---|---|---|---|
00 | 24-Jan-21 | Initial Project | --- | Repository |
01 | 25-Jan-21 | Birthday Reminder | Link | Repository |
02 | 25-Jan-21 | Tours | Link | Repository |
03 | 17-Mar-21 | Reviews | Link | Repository |
04 | 17-Mar-21 | Accordion | Link | Repository |
05 | 18-Mar-21 | Menu | Link | Repository |
06 | 18-Mar-21 | Tabs | Link | Repository |
07 | 20-Mar-21 | Slider | Link | Repository |
08 | 20-Mar-21 | Generate Lorem Ipsum | Link | Repository |
09 | 22-Mar-21 | Color Generator | Link | Repository |
10 | 22-Mar-21 | Grocery Bud | Link | Repository |
16 | 24-Feb-21 | Markdown Preview | Link | Repository |
17 | 24-Feb-21 | Random Person | Link | Repository |
useState
- 01 - Birthday Reminder
useEffect and Conditional Rendering
- 02 - Tours
- 03 - Reviews
- 04 - Questions
- 05 - Menu
- 06 - Tabs
- 07 - Slider
Forms
- 08 - Lorem Ipsum Generator
- 09 - Color Shades Generator
- 10 - Grocery Bud
useRef
- 11 - Navbar
useContext
- 12 - Modal and Sidebar
- 13 - Stripe Submenus
useReducer and useContext
- 14 - Cart
React Router and useCallback
- 15 - Cocktails
Advanced Projects
- 16 - Markdown Preview
- 17 - Random Person
- 18 - Pagination
- 19 - Stock Photos
- 20 - Dark Mode
- 21 - Movie DB
- 22 - Hacker News
- 23 - Quizz
<type>(<scope>): <short summary>
│ │ │
│ │ └─⫸ Summary in present tense. Not capitalized. No period at the end.
│ │
│ └─⫸ Commit Scope: animations|bazel|benchpress|common|compiler|compiler-cli|core|
│ elements|forms|http|language-service|localize|platform-browser|
│ platform-browser-dynamic|platform-server|router|service-worker|
│ upgrade|zone.js|packaging|changelog|dev-infra|docs-infra|migrations|
│ ngcc|ve
│
└─⫸ Commit Type: build|ci|docs|feat|fix|perf|refactor|test
The <type>
and <summary>
fields are mandatory, the (<scope>)
field is optional.
feat(similarityReports): get similarity reports and display in a grid
update(similarityReports): add updatedDate col in the report grid
fix(similarityReports): display correct message error
update(global): change css system