Skip to content

GitHub repo template for generating Next.js-React web components

License

Notifications You must be signed in to change notification settings

mkdevops-se/web-template-react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

web-template-react

GitHub repo template for generating a web component repo with a Next.js-React project, for a similar Vue template see sibling repo web-template-vue.

Getting Started

Hit the Use this template button to create your own Next.js-React repository. After your repository is created, allow for a few minutes to pass while the Template Cleanup GitHub Actions Workflow perform setup of the repo (example).

Developing the Template

Have a Python 3 virtual environment and cookiecutter:

python3 -m venv venv
. venv/bin/activate
pip install cookiecutter

Set intended repo name and GitHub owner:

export REPO_NAME=mats-react-project
export GITHUB_USERNAME=mblomdahl

Generate project from template:

cookiecutter --no-input --output-dir . archetype/web_nextjs-react \
  repo_name=$REPO_NAME github_username=$GITHUB_USERNAME

Remove Cookiecutter templating, move generated project into repo root and commit:

rm -rvf archetype/ .github/
mv -v $REPO_NAME/* .
mv -v $REPO_NAME/.github .
mv -v $REPO_NAME/.env.development .
mv -v $REPO_NAME/.eslintrc.json .
mv -v $REPO_NAME/.gitignore .
mv -v $REPO_NAME/.nvmrc .
mv -v $REPO_NAME/.prettierignore .
rm -rvf $REPO_NAME/
git add .
git commit -m"Generated \`$REPO_NAME\` from Cookiecutter"

Review the generated project, run the project setup steps from the re-created root README:

yarn install && yarn build && yarn lint && yarn format:check && yarn dev

Finally, reset your branch to the origin state:

git reset --hard origin HEAD