Landing Page
Fast2build comes with many components to help you build a landing page in minutes.
The /doc/components folder contains all you need (hero, pricing, how it work, FAQ sections and others). Here's the list of all the components.
Configure your website settings through app.config.ts, including: theme, app, and more. Below is a complete example code.
The configuration for the Landing Page is done in /app/theme/home/layout, where you can configure the components according to your needs.
app.config.ts
export default defineAppConfig({ theme: { primary: "#3758f9" }, app: { name: "Fast2build", overall: { afterLoginPage: "/app/dashboard", membership: { }, seo: { meta: { title: 'Launch your SaaS product in hours - fast2build', ogTitle: 'Launch your SaaS product in hours - fast2build', description: 'The #1 Nuxt.js SaaS Startup Boilerplate. Code Less, Launch Fast. Template, Components, Login, Payment, Newsletter, and Others.', ogDescription: 'The #1 Nuxt.js SaaS Startup Boilerplate. Code Less, Launch Fast. Template, Components, Login, Payment, Newsletter, and Others.', ogImage: 'https://fast2build.com/image/sys/feature/fast2build-fetaure.png', twitterCard: 'summary_large_image', ogUrl: "https://fast2build.com" } }, header: { name: 'FastNavbarStandard', config: { logo: "/logo/fast2build-logo-black.png", navigations: [ {"name": "Pricing", href: "/pricing", type: "text"}, {"name": "Blog", href: "/blog", type: "text"}, {"name": "Doc", href: "/doc", type: "text"}, {"name": "Showcase", href: "/showcase", type: "text"}, {"name": "Dashboard", href: "/app/dashboard", type: "button", show: "auth"} ], dark: { logo: "/logo/fast2build-logo-white.png" } } }, footer: { name: 'FastFooterStandard', config: { logo: "", copyright: "© Copyright 2024 fast2build", links: [ { name: "Terms of service", link: "/terms-of-service" }, { name: "Privacy Policy", link: "/privacy-policy" }, { name: "Contact Us", link: "/contact-us" } ], media: [ { name: "X", link: "https://twitter.com/fast2build" }, { name: "Telegram", link: "https://t.me/ljinkai" }, { name: "Discord", link: "https://discord.gg/EnYFytnhZC" } ] } } }, home: { layout: [ { name: 'FastHeroStandard', config: { title: "Launch Your SaaS Product In Hours", description: "Code Less, Launch Fast. Make it easier to monetize small products and quickly launch online", buttons: [ {"name": "Get Start", href: "/"}, {"name": "how to start", href: "/doc", type: "link"}, ], image: { src: "/image/sys/feature/fast2build-fetaure.png" } } }, { name: 'FastFeatureVideo', config: { "title": "Build your SaaS", "description": "All-in-one solution to manage your SaaS business.", "list": [ { "layout": "left", "hightlight": { "icon": "/svg/sys/setup.svg", "text": "Start", "color": "#d81e06" }, "text_main": "Simple setup", "text_description": "Download the source code and use the command line to start", "video_main": "/video/setup_init.mp4", }, { "layout": "right", "hightlight": { "icon": "/svg/sys/login.svg", "text": "Config", "color": "#f5a33e" }, "text_main": "User login", "text_description": "Built-in integration of Google Login, Magic Login, Email Login", "video_main": "/video/login.mp4" }, { "layout": "left", "hightlight": { "icon": "/svg/sys/payment.svg", "text": "Online", "color": "#d4237a" }, "text_main": "Stripe/Paddle Payment", "text_description": "Quickly get online payment with your personal Stripe/Paddle token", "video_main": "/video/payment_online.mp4" } ] } }, { name: 'FastFeatureGrid', config: { title: "Gain more insight", description: "Use the Fast2build dev frame, you can manage every aspect of your business in one secure platform.", list : [ { title: "Simple and fast", description: "Simple configuration can be completed in 10 minutes", img: '/svg/sys/fast.svg' }, { title: "Rich components", description: "Various Tailwind CSS components, Hero, Call To Action, subscriptions, prices, FAQ, and more", img: "/svg/sys/components.svg" }, { title: "Rich functional modules", description: "Including website, account login, Magic link, Stripe payment, Mailchimp subscription, Supabase database, membership system, etc", img: "/svg/sys/function.svg" }, { title: "Complete source code", description: "Complete code, including front and back, database, etc., more custom development", img: "/svg/sys/source.svg" }, ] } }, { name: 'FastFactSimple', config: { "title": "Backed up by real data", "description": "With more and more templates and components, more and more users", "list": [ { "name": "Templates", "number": "45+" }, { "name": "Components", "number": "100+" }, { "name": "Support Tickets", "number": "100+" } ] } }, { name: 'FastHowItWorkStandard', config: { emphasize: "How it works", title: "How to use it quickly", description: "3 steps to quickly open the use of Fast2build, quickly online", list : [ { index: "1", title: "Get the source code", description: "The source code package includes various components such as the website, user login functionality, payment processing, and subscription management." }, { index: "2", title: "Personalized configuration", description: "Refer to the instructions to configure the homepage, Google login, Stripe payment, etc" }, { index: "3", title: "Quick release online", description: "Once configured, the source code can be released to a hosting platform like Vercel to go live" } ] } }, { name: 'FastPriceStandard', config: { title: "Simple Affordable Pricing", description: "Simple fixed pricing. 30 days money-back guarante", list : [ { title: "VIP", currency: "$", price: "79", pay_item: "price2", unit: "one-time", active: false, hightlight: "Popular", description: "The best SaaS template to start with", button : { name: "Get Started", action: { type: "default" }, }, privilege: [ {content: "Source code download and update", "check": true}, {content: "Complete documentation", "check": true}, {content: "Professional customer service", "check": true} ] }, { title: "Medium", currency: "$", price: "129", pay_item: "price1", unit: "one-time", active: true, hightlight: "Popular", description: "Updated continuously for one year", button : { name: "Get Started", action: { type: "default" }, }, privilege: [ {content: "Source code download and update", "check": true}, {content: "AI ChatGPT Integration", "check": true}, {content: "Complete documentation", "check": true}, {content: "Professional customer service", "check": true} ] } ] } }, { name: 'FastFAQStandard', config: { title: "FAQ", list: [ {"title": "What is Fast2build?", "answer": "<span class='font-bold'>Fast2build</span> is a development framework to help you quickly build and quickly ship SaaS products, you only need a simple configuration, you can publish your custom products in 10 minutes, including Website, Login, Payment, Subscription, Blog, Docs, Dark Mode and other functions. The Fast2build rapid development framework consists of rich pre-built templates and various components that you can use in any combination."}, {"title": "Can I use it for free?", "answer": "Payment is required before use, will provide the source code, you can do more custom development based on this source code."}, {"title": "Where can I get the source code?", "answer": "First, you need to log in, and then, pay for a one-time fee, you can get the source code download address on the website's Dashboard page."}, {"title": "Are there any online cases to refer to?", "answer": "Yes, fast2build.com. The website you're currently looking at was built using the fast2build rapid build framework."}, {"title": "Can I request a refund?", "answer": "If you are a Pro user with usage in 10 days, you can email kirin@fast2build.com to request a refund."} ] } }, { name: 'FastNewsletterForm', config: { title: "Join Fast2build Community", description: "Be the first to get the latest product updates", button: { "name": "Join Now" }, input: { "placeholder": "Enter your email" } } }, ] }, success_page: { layout: [ { name: 'FastSuccessStandard', config: { title: "🎉 Congratulations on becoming a VIP member!", description: "If there is any problem in use, please contact me, thanks again for your trust and support!", button: { "name": "Start using now", "link": "/app/dashboard" } } } ] }, settings_page: { layout: [ { name: 'FastSettingStandard', config: { } } ] }, pricing_page: { layout: [ { name: 'FastPriceStandard', config: { title: "Simple Affordable Pricing", description: "Simple fixed pricing. 30 days money-back guarante", list : [ { title: "VIP", currency: "$", price: "79", pay_item: "price2", unit: "one-time", active: false, hightlight: "Popular", description: "The best SaaS template to start with", button : { name: "Get Started", action: { type: "default" }, }, privilege: [ {content: "Source code download and update", "check": true}, {content: "Complete documentation", "check": true}, {content: "Professional customer service", "check": true} ] }, { title: "Medium", currency: "$", price: "129", pay_item: "price1", unit: "one-time", active: true, hightlight: "Popular", description: "Updated continuously for one year", button : { name: "Get Started", action: { type: "default" }, }, privilege: [ {content: "Source code download and update", "check": true}, {content: "AI ChatGPT Integration", "check": true}, {content: "Complete documentation", "check": true}, {content: "Professional customer service", "check": true} ] } ] } } ] } }})