Back to Browse

Web Scraping with Javascript & Next.js using Puppeteer and Scraping Browser

30.5K views
Feb 13, 2024
10:06:38

Bright Data's Scraping Browser (Free $10 Credits): https://brdta.com/kishansheth21 Part 2: https://www.youtube.com/watch?v=ZWVhk0fxHM0 In this video we will learn what is web scraping and use Bright Data's scraping browser to scrape live data for our travel planner app built using Next.js 14, Next UI, TailwindCSS, Zustand, Typescript, Redis, BullMQ, Puppeteer, Stripe, Prisma, PostgreSQL, deployment on Aptible with Docker and much more. 📚 Resources/Links Get ZEGOCLOUD SDK for 10,000 free mins: https://bit.ly/48mykeP Pre-built UIKits in low codes: https://bit.ly/3ULiBCZ Source Code (Give a ⭐️ it's free) : https://github.com/koolkishan/nextjs-travel-planner/ Assets: https://drive.google.com/file/d/1TKV-h7D7Gp22x1SzdBp2Nsk5rcXHNNlx/view?usp=sharing Stripe Docs: https://stripe.com/docs/payments/quickstart?client=react&lang=node NextUI Docs: https://nextui.org/ Aptible: https://www.aptible.com/ 💻 Join our Discord Community - https://discord.com/invite/gr3JYgUFzQ 🐦 Follow me on Twitter - https://twitter.com/thekishansheth 🖼️ Follow me on Instagram - https://www.instagram.com/thekishansheth/ 💼 Follow me on LinkedIn - https://www.linkedin.com/in/koolkishan/ 📚 Concepts & Features Covered 🚀 Next.js 14 App Directory with Tailwind CSS - Experience the sleek and modern UI, powered by the latest Next.js 14 and styled with Tailwind CSS for that perfect look and feel. 🔗 API Routes & Server Actions - Dive into seamless backend integration with Next.js 14's API routes and server actions, ensuring efficient data handling and server-side logic execution. 🕷 Scraping with Puppeteer, Redis, and BullMQ - Harness the power of Puppeteer for advanced web scraping, with Redis and BullMQ managing queues and jobs for robust backend operations. 🔑 JWT Tokens for Authentication and Authorization - Secure your app with JWT tokens, providing a reliable method for authentication and authorization across your platform. 💳 Stripe for Payment Gateways - Integrate Stripe for seamless payment processing, enabling secure and easy transactions for booking trips, flights, and hotels. ✈️ Book Trips, Flights, and Hotels with Stripe Payment Gateway - Make your travel booking experience effortless with our Stripe-powered payment system. 📊 Scrape Live Data from Multiple Websites - Stay ahead with real-time data scraping from multiple sources, keeping your app updated with the latest information. 💾 Store the Scraped Data in PostgreSQL with Prisma - Leverage PostgreSQL and Prisma for efficient storage and management of your scraped data, ensuring reliability and speed. 🔄 Zustand for State Management - Enjoy smooth and manageable state management in your app with Zustand, simplifying state logic and enhancing performance. 📦 Deployment on Aptible using Docker - Deploy your app confidently on Aptible with Docker, ensuring security and scalability within a containerized environment. ⏱️ Timestamps 00:00 Demo 10:15 Scraping Browser Intro 12:45 Architecture 14:25 What is Web Scraping? 16:55 Next.js App Setup 23:53 Admin Login 01:24:36 Admin Sidebar 01:49:38 Admin Scrape Data 02:55:10 Integrating Redis & BullMQ 03:20:20 Integrating Scraping Browser by Bright Data 03:35:30 Scraping Packages from Yatra 04:10:00 Scraping Individual Packages from Yatra 05:22:20 Admin Trips Page 05:43:40 Client Navbar 06:03:35 Client Footer 06:11:13 Client Trip Search 06:35:22 Client Trip Search Results Page 06:56:25 Client Trip Page 07:55:45 Client Login Signup 08:45:00 Client Logout 08:48:12 Integrating Stripe Payment Gateway 09:26:40 Client My Bookings Page 09:44:55 Creating Dockerfile 09:50:59 Deployment on Aptible #nextjs #webscraping #travelplanner #tailwindcss #zustand #webscraper #aptible #stripe #admindashboard

Download

0 formats

No download links available.

Web Scraping with Javascript & Next.js using Puppeteer and Scraping Browser | NatokHD