🚀 Pixel Blocks - Seamlessly Scalable, Affordable & Creator-Friendly Platform For Growth!

Pixel Blocks is a modern web application designed for content creators who want to get up and running quickly with an affordable, scalable solution. Built with Strapi as a powerful headless CMS and a custom Next.js front-end, Pixel Blocks makes it easy to manage and publish content without the complexity of traditional platforms.

Perfect for creators looking to sell merchandise, build communities, offer memberships, or host live and on-demand content, Pixel Blocks provides a flexible foundation for turning ideas into polished digital experiences.

With many more features and tools planned for the future, Pixel Blocks is built to grow alongside your vision — whether you're launching a passion project or scaling a content empire.

Features

🔹 Strapi CMS

• Fully customizable content types
• REST & GraphQL API support
• Role-based access control
• Media library for asset management

🔹 Next.js Front-End

• Server-side rendering (SSR) & static site generation (SSG)
• Optimized for SEO and performance
• Dynamic routing for effortless navigation
• Fully responsive and accessible design

Why Pixel Blocks

With Pixel Blocks, you get the power of a headless CMS and the speed of a modern front-end framework, making it perfect for content-rich applications, blogs, portfolios, and beyond.

🚧 Stay tuned for updates and improvements! 🚀

⚡ Quick Start With Pixel Blocks

1️⃣ Setting Up Strapi Clone the repository and navigate to the Strapi backend directory:

git clone https://github.com/pixelbasedweb/pixelbased.git
cd pixelbased/server

Install dependencies and start Strapi:

npm install
npm run develop

Strapi will run at http://localhost:1337/admin. Sign up and start creating content.

2️⃣ Setting Up Next.js Navigate to the front-end directory:

cd ../client

Install dependencies and start the development server:

npm install
npm run dev

Next.js will run at http://localhost:3000, fetching data from Strapi’s API.

🔗 Connect & Configure

• Update the API endpoint in client/config.js to point to your Strapi instance.
• Customize content types in Strapi and update the Next.js front-end accordingly.

🚀 You're now ready to build and launch with Pixel Blocks! 🎨🚀

Key notes and commands

Strapi comes with a full featured Command Line Interface (CLI) which lets you scaffold and manage your project in seconds.

develop

Start your Strapi application with autoReload enabled. Learn more

npm run develop

Start your NextJS application with autoReload enabled. Learn more

npm run dev

start

Start your Strapi or NextJS application with autoReload disabled.

npm run start

build

Build your admin panel and NextJS front-end.

npm run build

⚙️ Deployment

Strapi gives you many possible deployment options for your project including Strapi Cloud. Browse the deployment section of the documentation to find the best solution for your use case.

npm strapi deploy