Skip to content

Basic support for starters #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 4 commits into from
May 10, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
45 changes: 45 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,48 @@
# create-stackbit-app

Run `npx create-stackbit-app` in your terminal to create a new Stackbit application or add Stackbit into an existing site.

## Usage

To create a new Stackbit project from a starter, run the following command:

```txt
npx create-stackbit-app [dir]
```

To see a full list of options use the `--help` flag:

```txt
> npx create-stackbit-app --help

Options:
--version Show version number [boolean]
-s, --starter Choose a starter [choices: "nextjs", "ts-nextjs"]
--help Show help [boolean]
```

### Choosing a Starter

Use the `--starter` option for specifying a starter. Run the command with the `--help` flag to see a full list of available starters.

```txt
npx create-stackbit-app --starter ts-nextjs
```

If no starter option is provided, [the default starter](https://github.com/stackbit-themes/nextjs-starter) is used.

### Setting Project Directory

Pass a directory name as the only argument when running the command. For example, if you wanted your directory to be name `my-site`, the command would look something like this:

```txt
npx create-stackbit-app my-site
```

If no name is provided, the directory will be `my-stackbit-site-[id]`, where `[id]` is a randomly-generated string used to avoid directory conflicts.

## Adding Stackbit to Existing Projects

The script detects when you may be working with an existing project (it looks for a `package.json` file in the working directory).

If in an existing project, the script asks if you'd like to add Stackbit to the project. Today, this only prints a resource URL. If you choose _no_, the command exits.
15 changes: 15 additions & 0 deletions config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
const starters = [
{
name: "nextjs",
repoUrl: "https://github.com/stackbit-themes/nextjs-starter",
},
{
name: "ts-nextjs",
repoUrl: "https://github.com/stackbit-themes/ts-mui-nextjs-starter",
},
];

export default {
defaults: { dirName: "my-stackbit-site", starter: starters[0] },
starters,
};
37 changes: 30 additions & 7 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,15 @@
import chalk from "chalk";
import { exec } from "child_process";
import fs from "fs";
import { nanoid } from "nanoid";
import path from "path";
import readline from "readline";
import util from "util";
import yargs from "yargs";
import { hideBin } from "yargs/helpers";

import config from "./config.js";

/* --- Helpers --- */

const run = util.promisify(exec);
Expand All @@ -26,29 +29,49 @@ function prompt(question, defaultAnswer) {

/* --- Parse CLI Arguments */

const args = yargs(hideBin(process.argv)).parse();
const args = yargs(hideBin(process.argv))
.option("starter", {
alias: "s",
describe: "Choose a starter",
choices: config.starters.map((s) => s.name),
})
.help()
.parse();

/* --- References --- */

const starter = config.starters.find(
(s) => s.name === (args.starter ?? config.defaults.starter.name)
);
const dirName =
args._[0] ?? `${config.defaults.dirName}-${nanoid(8).toLowerCase()}`;

/* --- New Project --- */

async function cloneStarter() {
// Clone repo
const projectName = args._[0] ?? "my-stackbit-site";
const repoUrl = `https://github.com/stackbit/nextjs-starter`;
const cloneCommand = `git clone --depth=1 ${repoUrl} ${projectName}`;
console.log(`\nCloning into ${projectName} ...`);
const cloneCommand = `git clone --depth=1 ${starter.repoUrl} ${dirName}`;
console.log(`\nCreating new project in ${dirName} ...`);
await run(cloneCommand);

// Install dependencies
console.log(`Installing dependencies ...`);
await run(`cd ${projectName} && npm install`);
await run(`cd ${dirName} && npm install`);

// Set up git
console.log(`Setting up Git ...`);
await run(`rm -rf ${dirName}/.git`);
await run(
`cd ${dirName} && git init && git add . && git commit -m "New Stackbit project"`
);

// Output next steps:
console.log(`
🎉 ${chalk.bold("Welcome to Stackbit!")} 🎉

Follow the instructions for getting Started here:

https://github.com/stackbit/nextjs-starter#getting-started
${starter.repoUrl}#readme
`);
}

Expand Down
21 changes: 19 additions & 2 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

3 changes: 2 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "create-stackbit-app",
"version": "0.0.3",
"version": "0.1.0",
"description": "Create a new Stackbit site, or add Stackbit to an existing site.",
"main": "index.js",
"scripts": {
Expand All @@ -15,6 +15,7 @@
"type": "module",
"dependencies": {
"chalk": "^5.0.0",
"nanoid": "^3.3.4",
"yargs": "^17.3.1"
}
}