#100DaysOfCode Day 7: Today i built a youtube clone using ReactJS. Here's a simple 5 step thread on how to do the same.🧵
Replying to @_Dlite
I did, indeed. It took me about 7 hours but i reckon someone more experienced could probably have done it in half that time.
1
I used react-router-dom for the page routing, react-social-media-embed for the instagram embded and firebase for user authentication & database storage! Hope you like it. :)
1
#100DaysOfCode Day 12: Took some time away for a much needed break but i'm back. Today i built an Instagram clone in ReactJS. This was a challenging, but fun build!😁 Still working on some additional features.
Replying to @BiggPretzel @thesolesshow
Then you're already on the right track because as far as i know, mobile app developers, ethical hackers and cybersecurity experts all use python and/or javascript as part of their job. So stick to it!
1
Replying to @BiggPretzel @thesolesshow
Oh, that's cool! I like python. I think whatever you learn next should be influenced by exactly what it is you'd like to achieve. So for example, if you'd like to be a React Developer then yes, definitely go to Javascript next. :)
1
Replying to @BiggPretzel @thesolesshow
Thank you so much.🙏🏿😁 No, you don't need a MacBook for React at all. React is a javascript library and it works on any laptop running almost any operating system.
1
And that's about it for the logic behind the code. I'd like to add more functionality to it but i thought i'd share this much for now. I hope you enjoyed it! Thanks for making it to the end and i'll catch you next time. :)
2
4. Remove items from the basket
This action is also triggered by a dispatch and will
look for a match between the item selected for removal and all items in the basket array. When a match is found, that item is then removed from the basket array using the splice method.
1
1
3. Calculate the total value of the basket
As we add items to our basket, we need to keep track of the value of all items added or removed. To do that, let's define a function that will iterate through the basket array & keep track of the basket's value with the reduce method.
1
2. Add products to your basket
Once the user has logged in, they can add products to their basket by clicking a button which calls "addToBasket". That function will send the product into the data layer and add it to our current basket.
1
1. Login Page:
So the logic for the logic page will call signIn to login a user & register to create a new user. Once successful, both functions will take the user to the home page using the navigate function from react-router-dom.
1
Dependencies: I used Firebase for the user authentication, React Context API for the state management and React Router for the dynamic routing.
1
#100DaysOfCode Day 11: I spent the last couple of days building an Amazon clone in React. Here's a quick 4 step overview of how it works. 🧵






