Summary

Keywords

vadim savin not just development notjust.dev react-native tutorial react native ui design react native live coding live coding react tutorial react native pinterest clone pinterest clone tutorial react native pinterest clone

Full Transcript

Let's challenge ourselves and build a Pinterest clone with React Native. This is a great project-based tutorial for beginners to learn React Native and build your first cross-platform mobile application. This project is sponsored by NHost: Open Source Serverless backend for web and mobile apps. ➡️ Get your free account: https://bit.ly/3iV2Hln 📚 Enroll NOW for "The Full-stack Mobile Developer" and save 30% https://academy.notjust.dev/ 🎒 Download the Asset Bundle (Images, Dummy data, PDF presentation, cookies): https://assets.notjust.dev/pinterest In this series, we will learn how to build a full-stack, end-to-end Pinterest clone with React Native and NHost for the backend. By the end of this series, you will ✨ More confident in building mobile apps from end to end ✨ Be able to develop complex UI with React Native ✨ Implement a masonry layout (the Pinterest layout) ✨ Develop a backend and connect it with our React Native app ✨ Add authentication ✨ Implement the Storage layer for all the pins ✨ Design and query a highly performant GraphQL API ✨ and more 🐱‍💻 Source code https://github.com/notJust-dev/Pinterest 💬 Join the notJust Development gang and let's build together https://discord.gg/VpURUN2 Tag me on social media when you finish this build, and I will give you feedback on your project. Twitter: https://twitter.com/VadimNotJustDev IG: https://www.instagram.com/VadimNotJustDev LinkedIn: https://www.linkedin.com/in/vadimsavin TikTok: https://www.tiktok.com/@vadimnotjustdev Timecodes: 0:00 Getting Started 0:48 Today's Build 5:20 Prerequisites 6:53 Initialise Pinterest using Expo 16:04 Download & Import Asset Bundle 17:25 Screen Cleanup 19:00 Build the Pin Component 57:02 Build the Masonry Layout 01:24:14 Single Pin Page 01:41:39 Implementing App Navigation 01:53:46 Build the Profile Screen 02:00:36 Refactor Masonry List 02:12:45 Fixing Icons 02:16:22 Fixing Types 02:20:44 Create a Pin Screen 02:32:35 Implement Dynamic Columns in Masonry List 02:42:19 Build Demo & Next Stream Update 02:44:58 Question & Answer Session Disclaimer: This build is for educational purposes only!! All views, opinions, technology choices expressed in this video are my own and do not represent the views, opinions, technology choices of any entity whatsoever with which I have been, am now, or will be affiliated. #VadimSavin #notjustdev #reactnative