Fullstack Development Tutorial: From Setup to Completion | Book shelf Application скачать в хорошем качестве

Fullstack Development Tutorial: From Setup to Completion | Book shelf Application

Demo: https://ridhwandev.github.io/bookshelf/ 🧑🏽‍💻 Github links: Bookshelf CDK: https://github.com/RidhwanDev/bookshe... Bookshelf: https://github.com/RidhwanDev/bookshelf Dive deep into the world of full-stack development with this comprehensive guide, taking you step by step from the setup phase all the way to completion. Whether you're a beginner eager to learn or a veteran looking to upgrade your skills, this masterclass is designed for you. Covering a wide range of tools and techniques including AWS CLI, CDK CLI, Vite, React, Material-UI, Apollo GraphQL, and more, we leave no stone unturned. 🔖 Chapters: Introduction & Setup: Setting your local environment up with Node, AWS CLI, CDK CLI, and initiating a Vite project. AWS SSO configuration included. Cognito Authentication: Dive into AWS services as you learn to set up a CDK project and establish Cognito User Pool with TypeScript. Later, integrate Amplify for authentication in a Vite & TypeScript-based React app. React Router & Material UI: Design a navigable React app with a responsive navigation menu leveraging Material UI and React Router DOM. Backend API: A comprehensive segment covering backend setup and optimizations. Google Books API Integration: Connect your app to the Google Books API using GraphQL and Apollo, learning to manage paginated requests and more. UI Deep Dive into CRUD & Frontend Caching: The final segment unveils the process of setting up a bookshelf with React CRUD operations, optimizing the user experience through frontend caching. Closing Thoughts: Bringing together everything learned to showcase the masterpiece created. Remember to like, subscribe, and share this masterclass for more in-depth tutorials and walkthroughs. Happy coding! Timestamps: 00:00 - Introduction 01:50 - Installing Node 02:51 - Installing AWS CLI 04:10 - Installing CDK CLI 05:06 - Installing and setting up Yarn 06:00 - Creating a project with Vite 06:23 - AWS SSO Configuration (IAM Identity Center) 11:16 - Setting up CDK Project 12:52 - Creating AWS Cognito User Pool with TypeScript 15:03 - Deploying with 'cdk deploy' 15:50 - Creating React App using Vite & TypeScript 17:15 - Configuring React project 19:41 - Integrating Amplify for Authentication 22:06 - Customizing Amplify UI for Login 34:59 - Setting up Material UI 36:00 - Creating Header component 37:54 - Amplify useAuthenticator hook 38:37 - Constructing Navigation menu 40:53 - Making the component responsive 45:22 - Setting up React Router Dom 46:46 - Constructing Layout component 47:56 - Maintainable routes architecture 49:42 - Navigation with React Router Dom 50:52 - Implementing scalable routes architecture 52:15 - (Start of Backend API content, considering 38 seconds intro) 80:43 - (End of Backend API content, considering 28 mins and 24 secs main content) 80:55 - Enabling Google Books API 82:33 - Connecting Google Books API with GraphQL 88:37 - Building title component 89:19 - Building a Debounce Mechanism for Search Bar 92:13 - Designing Book Cards 98:33 - Creating Books with mutation 102:03 - Designing Loading Skeletons 104:15 - Advanced: Updating Apollo Cache with Paginated Requests 106:41 - Creating a custom hook 113:44 - Setting up the bookshelf page 114:30 - Creating tabbed components 117:22 - Creating the book cards 134:02 - Creating Skeleton elements 135:47 - Apollo pagination and caching 143:08 - Closing Thoughts & Outro