Skip to content

Commit

Permalink
docs: READMEの書き足しとビルドコマンドの変更
Browse files Browse the repository at this point in the history
  • Loading branch information
TeXmeijin committed Aug 9, 2020
1 parent 652ab8a commit 2ca14d6
Show file tree
Hide file tree
Showing 5 changed files with 50 additions and 44 deletions.
2 changes: 2 additions & 0 deletions .env.sample
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
MICROCMS_GET_API_KEY=<your-microcms-get-api-key>
MICROCMS_BASE_URL=https://<your-project-name>.microcms.io/api/v1
3 changes: 3 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -32,3 +32,6 @@ yarn-error.log*

# vercel
.vercel

# aspida
/types/apiClient/$api.ts
53 changes: 43 additions & 10 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,30 +1,63 @@
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`microCMS`](https://microcms.io/), [`aspida`](https://github.com/aspida/aspida). And this is using `TSX`, `Incremental Static Regeneration`.

## Getting Started
This project helps you to implement JAMStack service with TypeScript-friendly.

## Getting Started Development

First, run the development server:

```bash
npm run dev
# or
yarn dev
```

Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.

You can start editing the page by modifying `pages/index.js`. The page auto-updates as you edit the file.
## What's microCMS?

`microCMS` is a headless CMS service in Japan. Such as strapi, Contentful, DatoCMS, and so on.

Let's create account of `microCMS` for free, and make one api that has `/articles` path and create first article content.

Then you can access the api such as below command.

```bash
curl "https://<your-project-name>.microcms.io/api/v1/articles" -H "X-API-KEY: <your api key>"
```

## What's aspida?

## Learn More
Aspida is TypeScript friendly HTTP client wrapper for the browser and node.js.

Look `types/apiClient` directory.

To learn more about Next.js, take a look at the following resources:
Under the directory, you must define your backend API req/res types.
And, run the command `yarn build:api` and you will get `types/apiClient/$api.ts`.

- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
Then, check `modules/apiClient.ts`. This initializes aspida client and export it. With optimizing for `microCMS` APIs.

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
You can get microCMS content such as following code.

```typescript
const article = await apiClient.articles._cmsId(id).$get()
```

## Environments

You touch the env file. Called `.env.local`

```dotenv
MICROCMS_GET_API_KEY=<your-microcms-get-api-key>
MICROCMS_BASE_URL=https://<your-project-name>.microcms.io/api/v1
```

## Deploy on Vercel

The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/import?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.

Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.

## Others
Since this project will be used in my works, the settings for `eslint` and `husky` are also completed. `CSS in JS` is not installed because there is no standard.

## Contribution
I'm not familiar with React and Next.js, so if you have any suggestions for resolving errors or better improvements, please contribute via issue or pull request.
4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@
"license": "MIT",
"scripts": {
"dev": "next dev",
"build": "next build",
"api:build": "aspida --build",
"build": "aspida --build && next build",
"build:api": "aspida --build",
"start": "next start"
},
"lint-staged": {
Expand Down
32 changes: 0 additions & 32 deletions types/apiClient/$api.ts

This file was deleted.

1 comment on commit 2ca14d6

@vercel
Copy link

@vercel vercel bot commented on 2ca14d6 Aug 9, 2020

Choose a reason for hiding this comment

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

Please sign in to comment.