Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

With this React JS Code Challenge, you will apply the skills you have learned from the previous lessons in this Learn React playlist. The challenge is to build a simple color changer app with React.

Subscribe https://bit.ly/3nGHmNn

This lesson is part of a Learn React tutorial series playlist:
https://youtube.com/playlist?list=PL0Zuz27SZ-6PrE9srvEn8nbhOOyxnWXfp

Solution Source Code: https://github.com/gitdagray/react_beginner_challenge

React JS Code Challenge | React Beginner Project

(00:00) Intro
(00:05) The Code Challenge: Your First Project
(01:29) Begin Solution: create-react-app and set up
(04:35) Outlining the app components
(06:41) The square component
(09:02) The form input component
(11:19) useState hook and passing props
(12:56) Adding CSS styles
(14:51) Challenge Complete! How did you do?
(15:28) Additional Feature: Color Names to Hex Values
(20:12) Additional Feature: Toggle Text Color

ES7 React JS Snippets Extension for VS Code:
https://marketplace.visualstudio.com/items?itemName=dsznajder.es7-react-js-snippets

React Dev Tools Extension for Chrome:
https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi

Styled Components: https://styled-components.com/

References:
ReactJS Official site: https://reactjs.org/
React Wikipedia: https://en.wikipedia.org/wiki/React_(JavaScript_library)
React Jobs: https://www.ziprecruiter.com/candidate/search?search=react&location=

Follow Me:
Twitter: https://twitter.com/yesdavidgray
LinkedIn: https://www.linkedin.com/in/davidagray/
Blog: https://yesdavidgray.com
Reddit: https://www.reddit.com/user/DaveOnEleven

Was this React Beginner Project and Code Challenge helpful? If so, please share. Let me know your thoughts in the comments.

#react #beginner #project