https://github.com/ongzzzzzz/next-pwa-template
https://github.com/ongzzzzzz/next-pwa-template
Last synced: 3 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/ongzzzzzz/next-pwa-template
- Owner: ongzzzzzz
- Created: 2020-12-22T12:24:48.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2020-12-27T03:38:41.000Z (over 4 years ago)
- Last Synced: 2025-01-05T07:46:50.634Z (5 months ago)
- Language: JavaScript
- Size: 351 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# NextJS PWA Template
This PWA Template is intended to be hosted on [Vercel](https://vercel.com)
## Getting Started
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.
## Client-Side Firebase Integration
You can rename the `.env` file to `.env.local` and add your credentials into it and use it in a page like so:
```js
import firebase from '../path/to/lib/firebase';
firebase.firestore().collection('foo').doc('bar').get()
.then(doc => {
// do stuff
}).catch(err => console.error({ err }))
```
Alternatively, you can use [`useSWR`](https://github.com/vercel/swr) and query `api/my-collection` to get firebase data.
```jsx
import useSWR from 'swr'
const fetcher = async (...args) => {
const res = await fetch(...args);
return res.json();
};
export default function WaitableComponent() {
const { data } = useSWR(`/api/my-collection`, fetcher, { refreshInterval: 6900 });
if (data) { return
{data} }
else { return }
}
```
## Learn More
To learn more about Next.js, take a look at the following resources:
- [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.
## Deployment
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com) from the creators of Next.js.
Check out the [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.