Build a Twitter Clone with React.js [1]

Here's the first section of our series on building a Twitter clone with React.JS. In this module, we’ll work with functional components, routing, SVG images, CSS grid and SCSS.

Link to our Twitter React codebase: https://github.com/ebenezerdon/react-twitter-clone/tree/module-one Link to the color picker: https://chrome.google.com/webstore/detail/colorpick-eyedropper/ohcpnigalekghcmgcdcenkpelffpdolg?hl=en

Follow me on Twitter @ https://twitter.com/ebenezerDN Follow me on GitHub: https://github.com/ebenezerdon Message me on LinkedIn: https://linkedin.com/in/ebenezerdon

Outline

00:00:00 - Introduction 00:00:54 - Setting up our React app 00:05:08 - Creating our LeftPane component 00:09:54 - Setting up routing for our React Twitter app 00:13:59 - Adding a header to our LeftPane component 00:15:12 - Using NavLink to navigate through our React Twitter app 00:17:26 - Adding a footer to our LeftPane component 00:21:37 - Using CSS grid to create our Twitter app Layout 00:24:54 - Styling our nav links 00:28:18 - Adding a hover effect to our nav links 00:33:59 - Using SVG icons in our Twitter React app 00:39:47 - Styling SVG icons in our Twitter React app 00:42:13 - Styling the tweet button in our Twitter React app 00:45:43 - Styling our Twitter clone footer 00:50:37 - Using NavLink to style active components ... https://www.youtube.com/watch?v=Yhn-okK2q58