A modern, conversion-optimized business landing page template with built-in CMS, perfect for agencies, startups, and businesses. Built with React, TypeScript, Tailwind CSS and Express.js.
- Modern Dark Theme Design
- Fully Responsive Layout
- Built-in CMS Dashboard
- Performance Optimized
- Live Demo Available
- PostgreSQL Database
- SEO Friendly
- Easy Customization
- API Documentation
- React 18 with TypeScript
- Tailwind CSS
- Shadcn UI Components
- Express.js Backend
- PostgreSQL + Drizzle ORM
- Framer Motion Animations
- Clone repository
- Install dependencies:
npm install- Set environment variables:
DATABASE_URL=your_postgresql_database_url- Initialize database:
npm run db:push- Start development server:
npm run devThe app will run on http://localhost:5000
Edit theme.json to customize:
- Color scheme
- Typography
- Dark/light mode
- Border radius
Access CMS dashboard at /admin to manage:
- Hero section
- Features
- Testimonials
- Pricing plans
The following screenshots demonstrate the CMS interface:
GET /api/cms/hero- Retrieve active hero section content- Response:
{ id, heading, subheading, primaryButtonText, secondaryButtonText, isActive, updatedAt }
- Response:
POST /api/cms/hero- Create or update hero section content- Body:
{ heading, subheading, primaryButtonText, secondaryButtonText, isActive } - Response: Created hero content object
- Body:
GET /api/cms/features- Retrieve all features- Response: Array of feature objects
[{ id, title, description, icon, order }]
- Response: Array of feature objects
POST /api/cms/features- Create a new feature- Body:
{ title, description, icon, order } - Response: Created feature object
- Body:
GET /api/cms/testimonials- Retrieve all testimonials- Response: Array of testimonial objects
[{ id, name, role, content, image }]
- Response: Array of testimonial objects
POST /api/cms/testimonials- Create a new testimonial- Body:
{ name, role, content, image } - Response: Created testimonial object
- Body:
GET /api/cms/pricing- Retrieve all pricing plans- Response: Array of pricing plan objects
[{ id, name, price, features, isPopular }]
- Response: Array of pricing plan objects
POST /api/cms/pricing- Create a new pricing plan- Body:
{ name, price, features, isPopular } - Response: Created pricing plan object
- Body:
POST /api/contact- Submit contact form- Body:
{ name, email, message } - Response: Created contact object
- Body:
MarketBoost is fully tested and compatible with:
- Google Chrome (latest)
- Mozilla Firefox (latest)
- Safari (latest)
- Microsoft Edge (latest)
- Ensure your PostgreSQL server is running
- Verify DATABASE_URL is correctly set in your environment variables
- Check network connectivity if using a remote database
- Run
npm installto ensure all dependencies are installed - Clear node_modules and package-lock.json and reinstall if needed
- Ensure you're using Node.js version 16 or higher
- Contact your administrator for login credentials
- Ensure server is running with proper permissions
- All images are optimized and served in WebP format
- CSS and JavaScript are minified in production builds
- Lazy loading implemented for images and heavy components
- PageSpeed score of 90+ on both mobile and desktop
The template is fully responsive with specific optimizations for:
- Mobile phones (320px+)
- Tablets (768px+)
- Desktops (1024px+)
- Large screens (1440px+)