Skip to content

Commit

Permalink
feat: update README
Browse files Browse the repository at this point in the history
  • Loading branch information
alex-guoba committed Feb 20, 2024
1 parent 2407d0c commit 3b8b868
Show file tree
Hide file tree
Showing 2 changed files with 26 additions and 57 deletions.
59 changes: 25 additions & 34 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,55 +1,46 @@
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).

## Getting Started

First, run the development server:
Use [Next.js](https://nextjs.org/) and [Notion](https://www.notion.so/) to build a Blog.

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

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

You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
1. Built using Next.js, TS, and Tailwind CSS。
2. Use [Notion Public API](https://developers.notion.com/)
3. Full support for dark mode
4. Support [Static Site Generation](https://nextjs.org/docs/pages/building-your-application/rendering/static-site-generation)

This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
## Setup

## Learn More
1. Fork / clone this repo
2. follow Notions [getting started guide](https://developers.notion.com/docs/getting-started) to get a NOTION_TOKEN and a NOTION_DATABASE_ID, then add them to a file called .env.local.

To learn more about Next.js, take a look at the following resources:
```
NOTION_TOKEN=
NOTION_DATABASE_ID=
```

- [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.
3. install the dependences:

You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
```bash
npm install
```

## Deploy on Vercel
4. run locally
```bash
npm run dev
```

The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?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.
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.


## Feaatures
## Learn More

- Next.js SSG supported
## Deploy on Vercel

[SSG](https://nextjs.org/docs/pages/building-your-application/rendering/static-site-generation) make all pages generated when you run `next build`

- how to update content with SSG rendering.

- cache is only available in React’s Canary and experimental channels. Please ensure you understand the limitations before using cache in production. Learn more about React’s release channels here.
## Feaatures

## TODO

### MPV version
- [X] add cover, description for home page
- [ ] render blog page
- [ ] data statics
- [ ] share
24 changes: 1 addition & 23 deletions app/notion/_components/pdf.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,6 @@ export function PDFRender({ block, className }: PDFBlockProps) {

return (
<div key={id} className={cn(className, "w-full max-w-ful")}>
<NavTool pageNumber={pageNumber} numPages={numPages} title={title} ></NavTool>
<Nav pageNumber={pageNumber} numPages={numPages} title={title} />
<div
hidden={loading}
Expand Down Expand Up @@ -158,25 +157,4 @@ function Nav({
</div>
</nav>
);
}

function NavTool({
pageNumber,
numPages,
title,
}: {
pageNumber: number;
numPages: number;
title: string;
}) {
return (
<nav className="bg-gray-400 absolute flex items-center text-[white] px-[15px] rounded-[19px] bottom-[35px]">
<div className='cursor-pointer pl-2.5 px-[15px] py-2'> Prev </div>
<div className='cursor-pointer pl-2.5 px-[15px] py-2'> Next </div>
<div className="inline-block w-[50px] text-center h-6 mr-2.5"> <input type="number" /> / </div>
<div className='cursor-pointer pl-2.5 px-[15px] py-2'> ScaleUp </div>
<div className='cursor-pointer pl-2.5 px-[15px] py-2' > ScaleDown </div>
</nav>
);
}

}

0 comments on commit 3b8b868

Please sign in to comment.