# create-awesome > Create awesome Next.js apps in one command Latest version **0.7.1** (published 2017-07-19) · MIT license · 0 weekly downloads ## Install ```sh npm install create-awesome pnpm add create-awesome yarn add create-awesome bun add create-awesome ``` Provides the command `create-awesome`. ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support; pre 1.0. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 0.7.1 | | Published | 2017-07-19 | | First published | 2017-06-04 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Node | >=4 | | Dependencies | 11 | | Known vulnerabilities | 0 (+2 in 2 direct dependencies) | | Install scripts | no | | Maintainers | billymoon | | Keywords | awesome, next, react, next.js, create-awesome, create-react-app, boilerplate | ## Links - npm: https://www.npmjs.com/package/create-awesome - Repository: https://github.com/billymoon/create-awesome - Homepage: https://github.com/billymoon/create-awesome#readme - Issues: https://github.com/billymoon/create-awesome/issues - npm.io page: https://npm.io/package/create-awesome ## Dependencies (11) - [ms](https://npm.io/package/ms.md) ^1.0.0 - [mz](https://npm.io/package/mz.md) ^2.6.0 - [ora](https://npm.io/package/ora.md) ^1.2.0 - [chalk](https://npm.io/package/chalk.md) ^1.1.3 - [execa](https://npm.io/package/execa.md) ^0.6.3 - [promise](https://npm.io/package/promise.md) ^7.1.1 - [fs-extra](https://npm.io/package/fs-extra.md) ^3.0.0 - [commander](https://npm.io/package/commander.md) ^2.9.0 - [cross-spawn](https://npm.io/package/cross-spawn.md) ^5.1.0 - [mkdirp-then](https://npm.io/package/mkdirp-then.md) ^1.2.0 - [ansi-escapes](https://npm.io/package/ansi-escapes.md) ^2.0.0 ## Alternatives - [mobx-react](https://npm.io/package/mobx-react.md) — 2.8M weekly downloads - [rc-tree](https://npm.io/package/rc-tree.md) — 2.6M weekly downloads - [@react-oauth/google](https://npm.io/package/@react-oauth/google.md) — 1.3M weekly downloads - [@wagmi/connectors](https://npm.io/package/@wagmi/connectors.md) — 877.0K weekly downloads - [vee-validate](https://npm.io/package/vee-validate.md) — 836.4K weekly downloads ## Recent versions - 0.7.1 (latest) — 2017-07-19 - 0.7.0 — 2017-07-19 - 0.6.1 — 2017-06-05 - 0.6.0 — 2017-06-04 ## README # Create Next App The easiest way to create a [React](https://facebook.github.io/react) app with server-side rendering thanks to [Next.js](https://github.com/zeit/next.js) - [Getting Started](#getting-started) — How to create an app - [User Guide](https://github.com/billymoon/create-awesome/blob/master/lib/templates/default/README.md) — How to develop apps started with Create Next App - [Starting from Examples](#starting-from-examples) — How to create an app from a Next.js example If you run into any issues or have feedback, please [file an issue](https://github.com/billymoon/create-awesome/issues/new) ## Overview ```sh npm install -g create-awesome create-awesome my-app cd my-app/ npm run dev ``` Open [http://localhost:3000](http://localhost:3000) to view your running app. When you're ready for production, run `npm run build` then `npm run start`. Create Next App running in terminal Create Next App running in terminal ### Start Coding Now You **don't** need to install or setup Webpack or Babel. They come packaged with `next`, so you can just start coding. After running `create-awesome`, you're good to go! ## Getting Started ### Installation Install it once globally: ```sh npm install -g create-awesome ``` **You’ll need to have Node >= 6 on your machine**. You can use [nvm](https://github.com/creationix/nvm#usage) to easily switch Node versions between different projects. **You don't need to use Node as your primary backend**. The Node installation is only required for Create Next App and running the Next.js server in development/production. ### Creating an App To create a new app, run: ``` create-awesome my-app cd my-app ``` It will create a directory called `my-app` inside the current folder.
Inside that directory, it will generate the initial project structure and install necessary dependencies: ``` my-app/ README.md package.json next.config.js components/ index.js head.js nav.js pages/ index.js static/ favicon.ico ``` Routing in Next.js is based on the file system, so `./pages/index.js` maps to the `/` route and `./pages/about.js` would map to `/about`. The `./static` directory maps to `/static` in the `next` server, so you can put all your other static resources like images or compiled CSS in there. Out of the box, we get: - Automatic transpilation and bundling (with webpack and babel) - Hot code reloading - Server rendering and indexing of `./pages` - Static file serving. `./static/` is mapped to `/static/` Once the installation is finished, you can run some commands in your project: ### `npm run dev` or `yarn dev` Runs the app in the development mode.
Open [http://localhost:3000](http://localhost:3000) to view it in the browser. The page will reload if you make edits.
You will also see any errors in the console. ### `npm run build` or `yarn build` Builds the app for production to the `.next` folder.
It correctly bundles React in production mode and optimizes the build for the best performance. ### `npm run start` or `yarn start` Starts the application in production mode. The application should be compiled with \`npm run build\` first. Now you're ready to code & deploy your app! ## Starting from Examples There are a ton of examples in the [Next.js repo](https://github.com/zeit/next.js/tree/master/examples/) (and growing!) that you can use to bootstrap your app. To use an example: 1. Go to https://open.segment.com/create-awesome#examples 2. Search for an example you want and get it's name (looks like `basic-css`) 3. Run: `create-awesome --example basic-css example-app` 4. Done 💥 ## Acknowledgements We are grateful to the authors of existing related projects for their ideas as inspiration: * [Create React App](https://github.com/facebookincubator/create-react-app) * [Next.js](https://github.com/zeit/next.js) * [@eanplatter](https://github.com/eanplatter) * [@insin](https://github.com/insin) * [@mxstbr](https://github.com/mxstbr) Looking for alternatives? Here are some other project starter kits: * [Create React App](https://github.com/facebookincubator/create-react-app) * [insin/nwb](https://github.com/insin/nwb) * [mozilla-neutrino/neutrino-dev](https://github.com/mozilla-neutrino/neutrino-dev) * [NYTimes/kyt](https://github.com/NYTimes/kyt) * [gatsbyjs/gatsby](https://github.com/gatsbyjs/gatsby) * [enclave](https://github.com/eanplatter/enclave) * [motion](https://github.com/motion/motion) * [quik](https://github.com/satya164/quik) * [sagui](https://github.com/saguijs/sagui) * [roc](https://github.com/rocjs/roc) * [aik](https://github.com/d4rkr00t/aik) * [react-app](https://github.com/kriasoft/react-app) * [dev-toolkit](https://github.com/stoikerty/dev-toolkit) * [tarec](https://github.com/geowarin/tarec) * [sku](https://github.com/seek-oss/sku) Questions? Feedback? [Please let us know](https://github.com/billymoon/create-awesome/issues/new) --- _Source: https://npm.io/package/create-awesome · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._