TSX Docs

After running npx tsx-docs init and following the prompts, your project is generated in the specified folder.

All dependencies are installed as part of the process so you can just run the dev command straight away:

npm run dev

Navigate to http://localhost:3000 and you should see the app running!

Note: Type checking is done in a separate process so run npm run typecheck on a separate terminal (or let your IDE do its thing) to type check your code as you develop.

Adding Pages

Each file in the /pages directory will create a route for your application. As an example, create a file at /pages/test.tsx with following:

import React from 'react'

export default () => <p>Created a new page!</p>

Navigate to http://localhost:3000/test and you should see the new page with the above content!

Adding Sidebar Links

Open up tsx-docs.config.js and add routes to the config:

// /docs.config.js
routes: [
	{
		name: 'Test',
		path: '/test',
	},
],

That's it! The app should reload and display a Test link in the sidebar.

Configuring your Project

Now that you've run through the basic editing and development, it's time to make it yours!

Make the following tweaks to tsx-docs.config.js:

// edit the following with your information:

title: 'Project Docs',
description: 'This is an example project with create-next-docs',
author: 'William Gibson',
authorURL: 'http://loremgibson.com',

The above will make sure the title, window title, meta tags and footer info are all set up properly.

For all configuration options, have a look the Configuration page.

Deploying

The project includes a now.json configuration file for seamless deployments with Zeit Now so if you've set it up with your Github account your project will deploy automatically!

For other services or use-cases, have a look at the Next.js Production Deployment docs.

Have a look at all configuration options and the provided components