Search videos
Search across video titles, descriptions, and transcripts
Learn the basics of React, such as components, props, state, data fetching, and more, while building a job listing frontend.
Code:
https://github.com/bradtraversy/react-crash-2024
React Front To Back Full Course:
https://www.traversymedia.com/Modern-React-Front-To-Back-Course
Check out all my courses:
Social Media:
Github - https://github.com/bradtraversy
Twitter - https://twitter.com/traversymedia
Instagram - https://www.instagram.com/traversymedia
Facebook - https://www.facebook.com/traversymedia
Linkedin - https://www.linkedin.com/in/bradtraversy
Timestamps:
- Intro
- What Is React? (Slide)
- Why React? (Slide)
- What Are Components? (Slide)
- What Is State? (Slide)
- What Are Hooks? (Slide)
- What Is JSX? (Slide)
- SPA, SSR, SSG (Slide)
- Vite (Slide)
- Project Demo
- Setup React With Vite
- File Explanation
- Boilerplate Cleanup
- Tailwind CSS Setup
- JSX Crash Course
- Start Homepage
- Navbar Component
- Image Import
- Hero Component
- Props
- Default Props
- Wrapper Components
- JobListings Component
- Create Lists With map()
- Single JobListing Component
- Limit Jobs to 3
- useState() Hook & Desc Toggle
- Creating an Event
- Updating Component State
- React Icons Package
- React Router Setup
- Create Routes From Elements
- Router Provider
- Homepage Component/Route
- Layouts
- Jobs Page Component/Route
- Link Component
- Custom 404 Page
- Active Links With NavLink
- Conditional Rendering
- JSON Server Setup
- useEffect() & Data Fetching
- Loading Spinner
- Conditional Fetching
- Proxying
- Single Job Page
- useParams() to Get ID
- Data Loaders
- Single Job Output
- Add Job Page
- Working With Forms
- Form Submission
- Pass Function as Prop
- POST Request to Add Job
- Delete Job Button/function
- DELETE Request to Remove Job
- React Toastify Package
- Edit Job Page/Form
- Update Form Submission
- PUT Request to Update Job
- Build Static Assets For Production
1:38:36
1:40
7:18
43:53