React - How To Create A Budget App With React

Discover React Mastery: From Essential Concepts to Advanced Hooks, Master React Development with Real-World Projects and Boost Your Skills in Record Time!

4.0 (0)

12 learners

What you'll learn

Understand the fundamental concepts of React, including components and hooks.
Differentiate between React state and props and their respective uses.
Build and enhance web applications using React, including implementing features like infinite scrolling and currency conversion.
Apply React best practices to optimize application performance and debugging processes.

This course includes

43.3 hours of video
Certificate of completion
Access on mobile and TV

Summary

Keywords

webdevsimplified react js react project js react js project react project reactjs project reactjs react javascript react javascript project javascript project js budget app javascript budget app

Full Transcript

Learn React Today Course: https://courses.webdevsimplified.com/learn-react-today Creating CRUD apps in React is something that most beginners struggle with so in this video I will be explaining how I would go about creating a simple CRUD app built around budgeting. This is a fun project since it covers many intermediate and beginner level React concepts that all come together to create a complex project. 📚 Materials/References: GitHub Code: https://github.com/WebDevSimplified/react-budget-app Learn React Today Course: https://courses.webdevsimplified.com/learn-react-today 🌎 Find Me Here: My Blog: https://blog.webdevsimplified.com My Courses: https://courses.webdevsimplified.com Patreon: https://www.patreon.com/WebDevSimplified Twitter: https://twitter.com/DevSimplified Discord: https://discord.gg/7StTjnR GitHub: https://github.com/WebDevSimplified CodePen: https://codepen.io/WebDevSimplified ⏱️ Timestamps: 00:00 - Introduction 00:40 - Basic Component HTML/CSS 05:10 - Budget Card Component HTML/CSS 16:10 - Budget Context 25:45 - useLocalStorage Hook 28:55 - Adding Budgets 38:08 - Adding Expenses 45:08 - Uncategorized Budget Card 47:55 - Total Budget Card 50:28 - View/Edit/Delete Expenses #React #WDS #ReactProject

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Welcome