/fuzzie-production

From YT Video "SAAS Automation Builder: Clerk Authentication, Neon Tech, Uploadcare, Ngrok, Nextjs 14, Stripe, Bun"

Primary LanguageTypeScript

Fuzzie (SASS Automation Builder)

This project is a fork of fuzzie-production, from the Youtube Video of Web Prodigies.

Video Description

🎁 Cheapest price to access Prodigies University: https://webprodigies.com/prodigiesuni...


Here is the discord if you want to hangout or get support: https://discord.gg/amjqmdyKHp Previous Video: Build A SAAS Website Builder, All in one CRM platform, Ticket tracking system, funnels, Stripe Connect, Sell Products through website builder etc: https://youtu.be/6omuUOZcWL0


IMPORTANT LINKS Clerk Authentication: https://go.clerk.com/qbebvpA Neon Tech: https://neon.tech/ Upload Care: https://uploadcare.com/?via=emmanuel Screen Studio: https://screenstudio.lemonsqueezy.com... Stripe Cheat Sheet: COMING SOON Google Drive App Link: https://console.cloud.google.com/mark... React Flow: https://reactflow.dev/ Start A SAAS For FREE Today: https://www.gohighlevel.com/?fp_ref=w... Github Code: https://github.com/webprodigies/fuzzi... License For Plura: https://webprodigies.com/license

Google Scopes for clerk // https://www.googleapis.com/auth/useri... // https://www.googleapis.com/auth/useri... // https://www.googleapis.com/auth/drive... // https://www.googleapis.com/auth/drive... // https://www.googleapis.com/auth/drive...


Features: FYI- all connection are setup from scratch we did not use an integration library πŸ˜‰!!! We wanted to show you what it takes to create all this stuff. 🀯 B2C SaaS 🏒 Connect users Google Drive to the app 🌐 Watch for changes in google drive πŸš€ Connect users slack to send notification and custom messages πŸ’» Connect users discord to send notification and custom messages πŸ”„ Connect users Notion to create entries in a database πŸ›’ Stripe to charge month to month subscriptions πŸ” Payments based on credits consumed πŸ’³ Beautiful redesigned node interface 🚨 Drag and drop node builder πŸ’° Create automations flows πŸ“Š Create a sequence of actions to fire after a trigger event happens πŸ—ΊοΈ Mini map to see all workflow nodes ⭐️ Infinite Canvas ✨ Expandable sidebar with drag feature ⚑️Aceternity UI β˜€οΈ Light & Dark mode πŸ“„ Functioning beautiful landing page

⏰ Timestamps: 0:00 - Intro 08:12 - AI Video Editor Screen Studio (Not paid sponsorship) 08:46 - Project Setup 09:29 - How to use Shadcn UI in Nextjs 14 11:49 - How to use Aceternity UI in Nextjs 14 14:46 - How to use https in localhost for Nextjs 14 17:04 - Navbar 20:30 - How to change fonts in Nextjs 14 24:12 - Setup Animations 24:55 - Landing Page 49:40 - How I made 40k through social media in 2 weeks 01:15:13 - Sidebar 01:26:39 - How to setup dark mode and light mode 01:32:48 - Settings Page 01:42:05 - Prisma And Neon Tech 01:49:07 - How to upload files in Nextjs14 with Uploadcare 01:59:09 - How to setup Authentication with Clerk 02:05:54 - Google Scopes 02:06:55 - How to setup Google Console 02:12:39 - How to use Ngrok in Nextjs 14 app 02:15:40 - Create Sign-in And Sign-up page 02:45:31 - Prodigies University (Become the best version of yourself) 02:51:37 - Implementing global state management for components for Integration & Automation

Intro Music - Perrin Joseph

Credits: Type: Web Prodigies Promotional Cinematic Audio. Music: High Alert by Soundridemusic Link to Video: https://www.youtube.com/watch?v=kscJH...

Getting Started

First, run the Next.js development server:

npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying app/page.tsx. The page auto-updates as you edit the file.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js, take a look at the following resources:

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.