Introduction:

Node.js CLI app that is responsible for scaffolding React/Next.js project with headless CMS, data fetching, styling, reusable components, and pre-commit hooks.

List of dependencies:

• inquirer for complex input prompts.
• arg to parse our CLI arguments
• listr for progress lists.
• ncp Asynchronous recursive file & directory copying.
• esm ECMAScript module loader.

List of features :

• Installing Next.js app.
• Restructuring files system.
• Add layouts and generic components.
• Setup styling library with SASS for typography, colors, and media queries.
• Add TailwindCSS as a utility-first CSS framework.
• Setup Contentful CMS by installing dependencies, creating GraphQl client, automating types generation for content models using graphql-codegen, and adding utilities to map rich text JSON formatted to reusable typography components.
• Setup path aliases in tsconfig.
• Setup eslint and pre-commit hooks with Husky.
• Create env variables public config using dotenv.

List of commands:

• -y / --yes : Skip prompts and init project with TS and CTF
• -t / --typescript : Init Typescript
• -c / --contentful : Init Contentful

Project structure:

• bin :

  — CLI entry point

• src :

  — CLI logic

• templates :

  — Language-specific templates

How to setup:

Clone this repo, then cd into it and run npm link to create a global symlink to this project. The output should be something like this:

[ '/usr/local/Cellar/node/11.6.0/bin/node',
  '/Users/sobhi_alkhuder/dev/create-sl-app/bin/create-sl-app' ]

Note: paths will be different for you depending on where your project lies and where you have Node.js installed.

Then you will be able to run create-sl-app globally.

What needs to be done:

1. Create .env.local file and add the needed credentials.
2. Add fonts to the public folder and load them in global.css.

License:

MIT

Authors:

Sobhi Al Khuder
Djimo van Berlo