Skip to content
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

More helpful README #14830

Merged
merged 9 commits into from
Jul 24, 2020
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
32 changes: 27 additions & 5 deletions packages/create-next-app/README.md
Original file line number Diff line number Diff line change
@@ -1,8 +1,30 @@
# create-next-app
# Create Next App

This package includes the global command for creating [Next.js](https://github.com/vercel/next.js) applications.
The easiest way to get started with Next.js is by using `create-next-app`. This simple CLI tool enables you to quickly start building a new Next.js application, with everything set up for you. You can quickly create a new app using the default Next.js template, or choose from one of the <a aria-label="Next.js Starter Templates" href="https://github.com/vercel/next.js/tree/canary/examples">templates available here.</a> To get started, you can use the following command:
lfades marked this conversation as resolved.
Show resolved Hide resolved

Please refer to its documentation:
```bash
npx create-next-app
```

- [Setup](https://nextjs.org/docs/getting-started#setup) – How to create a new Next.js application.
- [Documentation](https://nextjs.org/docs) – How to develop Next.js applications.
To create a new app in a specific folder, you can send a name as an argument. For example, the following command will create a new Next.js app called `blog-app` in a folder with the same name:

```bash
npx create-next-app blog-app
```

## Options

`create-next-app` comes with the following options:

* **-e, --example [name]|[github-url]** - An example to bootstrap the app with. You can use an example name from the [Next.js repo](https://github.com/vercel/next.js/tree/master/examples) or a GitHub URL. The URL can use any branch and/or subdirectory.
* **--example-path &lt;path-to-example&gt;** - In a rare case, your GitHub URL might contain a branch name with a slash (e.g. bug/fix-1) and the path to the example (e.g. foo/bar). In this case, you must specify the path to the example separately: `--example-path foo/bar`

## Why use Create Next App?

`create-next-app` allows you to create a new Next.js app within seconds. It is officially maintained by the creators of Next.js, and includes a number of benefits:

* **Interactive Experience**: Running `npx create-next-app` (with no arguments) launches an interactive experience that guides you through setting up a project.
MehediH marked this conversation as resolved.
Show resolved Hide resolved
* **Zero Dependencies**: Initializing a project is as quick as one second. Create Next App has zero dependencies.
* **Offline Support**: Create Next App will automatically detect if you're offline and bootstrap your project using your local package cache.
* **Support for Examples**: Create Next App can bootstrap your application using an example from the Next.js examples collection (e.g. `npx create-next-app --example api-routes`).
* **Tested**: The package is part of the Next.js monorepo and tested using the same integration test suite as Next.js itself, ensuring it works as expected with every release.
39 changes: 36 additions & 3 deletions packages/next/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,13 +15,46 @@
</a>
</p>

## The React Framework

Next.js is used by the world's leading companies and independent developers.

* **Pre-Rendering** - Statically generated and server-rendered React applications have never been easier.
* **Static Exporting** - No need to learn a new framework. Exporting a static site with Next.js is as easy as a single command.
* **CSS-in-JS** - Next.js comes with `styled-jsx` included, but it also works with every CSS-in-JS solution you know and love.
* **Built-in TypeScript support** - Next.js provides an integrated TypeScript experience out of the box, similar to an IDE.
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
* **Built-in TypeScript support** - Next.js provides an integrated TypeScript experience out of the box, similar to an IDE.
* **Built-in TypeScript Support** - Next.js provides an integrated TypeScript experience out of the box, similar to an IDE.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hi @Timer, @lfades suggested that this was redundant and the readme should directly link to https://nextjs.org/learn instead. Please let me know what you think, and if I should keep this on the Next.js readme.

* **Zero Configuration** - Automatic code splitting, filesystem based routing, hot code reloading and universal rendering. All included.
* **Fully Extensible** - Complete control over Babel and Webpack. Customizable server, routing and next-plugins.
* **Ready for Production** - Optimized for a smaller build size, faster dev compilation and dozens of other improvements.

lfades marked this conversation as resolved.
Show resolved Hide resolved
## Getting Started

Visit <a aria-label="next.js learn" href="https://nextjs.org/learn">https://nextjs.org/learn</a> to get started with Next.js.
Creating a new app with Next.js is easy with the `create-next-app` CLI. Create Next App allows you to create a Next.js app with a single command and set up everything for you, enabling you to get started within minutes.

```sh
npx create-next-app
# or
yarn create next-app
```

For more details on getting started with Next.js, including how to manually create a new app, <a aria-label="Next.js getting started instructions" href="https://nextjs.org/docs/getting-started#setup">follow the instructions here.</a>
MehediH marked this conversation as resolved.
Show resolved Hide resolved

## Learning and Documentation

Learning the basics of Next.js is easy with our <a aria-label="next.js learn" href="https://nextjs.org/learn/basics/create-nextjs-app">step-by-step guide available here.</a> The interactive tutorial guides you through some of the fundamental concepts of Next.js. You can earn points as you go, and make a <a aria-label="Next.js Learn demo blog" href="https://next-learn-starter.now.sh/">very simple blog app</a> within a few hours.

Visit <a aria-label="next.js learn" href="https://nextjs.org/docs">https://nextjs.org/docs</a> to view the full documentation.
MehediH marked this conversation as resolved.
Show resolved Hide resolved
lfades marked this conversation as resolved.
Show resolved Hide resolved

## Who is using Next.js?

Next.js is used by the world's leading companies. You can check out the <a aria-label="Next.js Showcase" href="https://nextjs.org/showcase">full showcase here</a>, but here are just a few we love:

## Documentation
* <a aria-label="Twitch site built with Next.js" href="https://nextjs.org/showcase/twitch">Twitch</a>
* <a aria-label="Hulu site built with Next.js" href="https://nextjs.org/showcase/hulu">Hulu</a>
* <a aria-label="TikTok site built with Next.js" href="https://nextjs.org/showcase/tiktok">TikTok</a>
* <a aria-label="Nike site built with Next.js" href="https://nextjs.org/showcase/nike">Nike</a>
* <a aria-label="Marvel site built with Next.js" href="https://nextjs.org/showcase/marvel">Marvel</a>
MehediH marked this conversation as resolved.
Show resolved Hide resolved

Visit <a aria-label="next.js learn" href="https://nextjs.org/docs">https://nextjs.org/docs</a> to view the documentation.

## Contributing

Expand Down