This repository is for a web magazine project utilizing a mono-repo setup that includes both the backend and frontend codebases. The backend is powered by Strapi, a headless CMS, allowing for easy content management and API generation. The frontend is developed with Gatsby, a React-based static site generator, and styled with Tailwind CSS for responsive and customizable design.
- Strapi: Open-source headless CMS for managing and delivering your content.
- Gatsby: React-based framework for creating fast and secure websites.
- Tailwind CSS: Utility-first CSS framework for rapid UI development.
- GraphQL: A query language for your API.
The project is divided into two main directories:
/backend: Contains the Strapi application with the content models, plugins, and configurations./frontend: Houses the Gatsby application, including pages, components, and styles.
Included in the frontend is an example component IssuePage, which demonstrates how to fetch and display an issue and its articles from Strapi using GraphQL and render it with Gatsby and Tailwind CSS for styling.
- Node.js (LTS version)
- Yarn or npm
- Gatsby CLI (optional)
- Strapi CLI (optional)
-
Clone the repository
git clone <repository-url>
-
Install Backend Dependencies Navigate to the backend directory and install dependencies.
cd backend yarn install # or npm install
-
Install Frontend Dependencies Navigate to the frontend directory and install dependencies.
cd frontend yarn install # or npm install
In the backend directory, start the Strapi server.
yarn develop # or npm run developIn a new terminal window, navigate to the frontend directory and start the Gatsby server.
gatsby developAfter starting the backend, access the Strapi admin panel at http://localhost:1337/admin.
You can deploy in any NodeJs Server by building both frontend and backend folders.
