Skip to content

Commit

Permalink
Update README by provided more information
Browse files Browse the repository at this point in the history
  • Loading branch information
ixartz committed Mar 31, 2021
1 parent fa6f1bc commit cf1fc70
Showing 1 changed file with 37 additions and 10 deletions.
47 changes: 37 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -73,22 +73,49 @@ Then, you can run locally in development mode with live reload:
npm run dev
```

Open http://localhost:8080 with your favorite browser to see your project.
Open http://localhost:8080 with your favorite browser to see your project. For your information, Next JS need to take some time to compile the project for your first time.

```
.
├── public # Static files
└── src
├── pages # Next.js pages
└── styles # CSS files
├── README.md # README file
├── public
│ └── assets
│ └── images # Image used by the template, it can be replaced by your own images
├── src
│ ├── background # Atomic background component
│ ├── button # Atomic button component
│ ├── cta # Atomic cta component
│ ├── feature # Atomic feature component
│ ├── footer # Atomic footer component
│ ├── hero # Atomic hero component
│ ├── layout # Atomic layout component
│ ├── navigation # Atomic navigation component
│ ├── pages # Next JS pages includes index page
│ ├── styles # Atomic styles component
│ ├── templates # List of blocks components
│ └── utils # Atomic utils component
├── tailwind.config.js # Tailwind CSS configuration file
└── tsconfig.json # TypeScript file
```

### Customization

You can easily configure Next js Boilerplate. Please change the following file:
You can easily configure the theme. Please change the following file:

- `public/apple-touch-icon.png`, `public/favicon.ico`, `public/favicon-16x16.png` and `public/favicon-32x32.png`: your blog favicon, you can generate from https://favicon.io/favicon-converter/
- `src/styles/main.css`: your blog CSS file using Tailwind CSS
- `public/apple-touch-icon.png`, `public/favicon.ico`, `public/favicon-16x16.png` and `public/favicon-32x32.png`: your favicon, you can generate from https://favicon.io/favicon-converter/
- `src/styles/main.css`: your CSS file using Tailwind CSS
- `utils/Config.ts`: website configuration file
- `src/pages/index.tsx`: the index page of the theme use the `Base` component
- `src/template/Base.tsx`: the `Base` component using component blocks
- `src/templates/*`: the list of component blocks
- `src/*`: other folders in src are the atomic components used by components blocks

Here is the layer:

- the entry point: `index.tsx` in `src/pages`
- the `Base` template: `Base.tsx` in `src/templates`
- use component blocks from `src/templates/*`
- use atomic components from `src/*`

### Deploy to production

Expand All @@ -107,13 +134,13 @@ You can create an optimized production build with:
npm run build-prod
```

Now, your blog is ready to be deployed. All generated files are located at `dist` folder, which you can deploy with any hosting service.
Now, your theme is ready to be deployed. All generated files are located at `dist` folder, which you can deploy with any hosting service.

### Deploy to Netlify

Clone this repository on own GitHub account and deploy to Netlify:

[![Netlify Deploy button](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/ixartz/Next-js-Boilerplate)
[![Netlify Deploy button](https://www.netlify.com/img/deploy/button.svg)](https://app.netlify.com/start/deploy?repository=https://github.com/ixartz/Next-JS-Landing-Page-Starter-Template)

### Contributions

Expand Down

0 comments on commit cf1fc70

Please sign in to comment.