Merge pull request #166 from akd-io/release/0.2.1

v0.2.1

Author: akd-io

.github/workflows/main.yml

@@ -6,7 +6,7 @@ on:
 
 jobs:
   build:
-    name: "Build, lint, and test on Node ${{ matrix.node }} and ${{ matrix.os }}"
+    name: "${{ matrix.os }}"
 
     strategy:
       matrix:

CONTRIBUTING.md

@@ -11,9 +11,9 @@
 4. Add new flags to the CLI in [`src/main/index.ts`](src/main/index.ts)
 5. Add the plugin to the `plugins` array in [`src/main/setup/setup.ts`](src/main/setup/setup.ts).
 6. Add potential plugin steps to the `steps` array in [`src/main/setup/setup.ts`](src/main/setup/setup.ts). Steps are run top-to-bottom.
-7. Update the `README.md`:
+7. Update the [`README.md`](README.md):
    - Add the technology to the technology list
-   - Update the `Usage` section to include the new technology
+   - Update the `Usage` section by copy pasting the output of running `yarn print:help`
 8. Consider expanding some of the e2e tests to include the new technology.
 9. Run tests using `yarn test` to ensure they all pass
 10. Submit a Pull Request on GitHub

LICENSE

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2021 Anders Kjær Damgaard
+Copyright (c) Anders Kjær Damgaard
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -5,7 +5,7 @@
     <img alt="" src="https://img.shields.io/npm/v/create-next-stack?style=flat-square">
   </a>
   <a aria-label="Build status" href="https://github.com/akd-io/create-next-stack/actions/workflows/main.yml?query=branch%3Adevelop">
-    <img alt="" src="https://img.shields.io/github/workflow/status/akd-io/create-next-stack/CI/develop?style=flat-square">
+    <img alt="" src="https://img.shields.io/github/actions/workflow/status/akd-io/create-next-stack/main.yml?branch=develop&style=flat-square">
   </a>
   <a aria-label="Last commit" href="https://github.com/akd-io/create-next-stack/commits/develop">
     <img alt="" src="https://img.shields.io/github/last-commit/akd-io/create-next-stack/develop?style=flat-square">
@@ -33,13 +33,7 @@ Where [Create Next App](https://github.com/vercel/next.js/tree/canary/packages/c
 
 This repository covers the CLI tool, while [create-next-stack-website](https://github.com/akd-io/create-next-stack-website) covers the site.
 
-To get started, go to [create-next-stack.com](https://www.create-next-stack.com) or run:
-
-```bash
-npx create-next-stack
-```
-
-If using the CLI, you'll be prompted to pick a project name, and your preferred technologies like so:
+To get started, go to [create-next-stack.com](https://www.create-next-stack.com). Here you'll be able to choose the technologies you want to use and get the corresponding CLI command.
 
 <p align="center">
   <img width="600" alt="Screenshot of Create Next Stack running in a terminal" src="assets/screenshot.png">
@@ -74,6 +68,7 @@ The table below provides an overview of the technologies currently supported by
 | [Husky](https://typicode.github.io/husky/)                | [Docs](https://typicode.github.io/husky/) - [GitHub repo](https://github.com/typicode/husky)                                                                         |
 | [lint-staged](https://github.com/okonet/lint-staged)      | [GitHub repo](https://github.com/okonet/lint-staged)                                                                                                                 |
 | [GitHub Actions](https://github.com/features/actions)     | [Docs](https://docs.github.com/en/actions) - [Workflow syntax](https://docs.github.com/en/actions/reference/workflow-syntax-for-github-actions)                      |
+| [React Icons](https://react-icons.github.io/react-icons/) | [GitHub repo](https://github.com/react-icons/react-icons)                                                                                                            |
 
 ## Usage
 
@@ -99,6 +94,7 @@ OPTIONS
   --package-manager=(pnpm|yarn|npm)  Sets the preferred package manager. (Required)
   --prettier                         Adds Prettier. (Code formatting)
   --react-hook-form                  Adds React Hook Form. (Form library)
+  --react-icons                      Adds React Icons. (Icon library)
   --styling=<styling-method>         Sets the preferred styling method. (Required) <styling-method> = emotion|styled-components|tailwind-css|css-modules|css-modules-with-sass
 ```
 

assets/screenshot.png

@@ -1,7 +1,7 @@
 {
   "name": "create-next-stack",
   "description": "Create Next Stack is a website and CLI tool used to easily set up the boilerplate of new Next.js apps.",
-  "version": "0.2.0",
+  "version": "0.2.1",
   "author": "Anders Kjær Damgaard @akd-io",
   "bugs": "https://github.com/akd-io/create-next-stack/issues",
   "homepage": "https://github.com/akd-io/create-next-stack",
@@ -51,6 +51,8 @@
     "test:small": "yarn build && node lib/tests/e2e/manual-test.js --debug --package-manager=pnpm --styling=css-modules",
     "test:large": "yarn build && node lib/tests/e2e/manual-test.js --debug --package-manager=pnpm --styling=emotion --react-hook-form --formik --prettier --formatting-pre-commit-hook --chakra --framer-motion --github-actions",
     "test:cna": "yarn build && node lib/tests/e2e/test-cna.js",
+    "print:help": "yarn build && ./bin-test/run-prod --help",
+    "print:version": "yarn build && ./bin-test/run-prod --help",
     "version": "oclif-dev readme && git add README.md",
     "format": "prettier --write --ignore-path=.prettierignore .",
     "format:check": "prettier --check --ignore-path=.prettierignore .",

package.json

@@ -26,7 +26,7 @@ export type CreateNextStackArgs = UnknownObject // Change to ParserOutput["args"
 export type CreateNextStackFlags = Partial<CreateNextStackParserOutput["flags"]> // Change to CreateNextStackParserOutput["flags"] if it becomes strongly typed in the future. (Currently not a Partial.)
 
 // Package manager flag:
-export const packageManagerOptions = ["yarn", "npm", "pnpm"] as const
+export const packageManagerOptions = ["pnpm", "yarn", "npm"] as const
 export type PackageManager = typeof packageManagerOptions[number]
 export const writablePackageManagerOptions = packageManagerOptions as Writable<
   typeof packageManagerOptions

prod-assets/templates/LandingPage/LandingPageTemplate.tsx

@@ -92,6 +92,11 @@ class CreateNextStack extends Command {
     "formatting-pre-commit-hook": flags.boolean({
       description: "Adds a formatting pre-commit hook. (Requires Prettier)",
     }),
+
+    // Icons
+    "react-icons": flags.boolean({
+      description: "Adds React Icons. (Icon library)",
+    }),
   }
 
   async run(): Promise<void> {

src/main/create-next-stack-types.ts

@@ -40,20 +40,13 @@ export const chakraUIPlugin = createPlugin({
   slots: {
     app: {
       imports: endent`
-        import { ChakraProvider, ColorModeProvider } from "@chakra-ui/react";
+        import { ChakraProvider } from "@chakra-ui/react";
         import { chakraTheme } from "../chakra-theme";
       `,
       componentsStart: endent`
-        <ChakraProvider resetCSS theme={chakraTheme}>
-          <ColorModeProvider
-            options={{
-              initialColorMode: chakraTheme.config.initialColorMode,
-              useSystemColorMode: chakraTheme.config.useSystemColorMode,
-            }}
-          >
+        <ChakraProvider theme={chakraTheme}>
       `,
       componentsEnd: endent`
-          </ColorModeProvider>
         </ChakraProvider>
       `,
     },