How To Build CodePen With React
Web Dev Simplified
šØ IMPORTANT:
Learn React Today Course: https://courses.webdevsimplified.com/learn-react-today
I love CodePen. It is perfect for prototyping project ideas and is a really cool idea. I like it so much I decided to see what it would take to create my own CodePen. In this video I will be showing you how to create a simple clone of the core functionality of CodePen using React.
š Materials/References:
GitHub Code: https://github.com/WebDevSimplified/React-CodePen-Clone
š§ Concepts Covered:
- How to create a text editor in React
- How to render custom HTML/CSS/JavaScript
š 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:32 - Demo 01:06 - Code Setup 02:59 - HTML Setup 05:34 - Editor Setup 12:35 - CSS 17:13 - CodePen Functionality 21:10 - Open Close Button 26:22 - Local Storage Hook 30:14 - Outro
#CodePen #WDS #ReactJS ... https://www.youtube.com/watch?v=wcVxX7lu2d4
127349320 Bytes