Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/toreylittlefield/next-bingo-game
Serverless Next.js bingo game with pusher.js, Fauna DB (FQL), and Netlify Identity. Real time multiplayer bingo!!
https://github.com/toreylittlefield/next-bingo-game
bingo-game chat-application faunadb netlify netlify-identity next nextjs pusher react reactjs real-time typescript
Last synced: 5 days ago
JSON representation
Serverless Next.js bingo game with pusher.js, Fauna DB (FQL), and Netlify Identity. Real time multiplayer bingo!!
- Host: GitHub
- URL: https://github.com/toreylittlefield/next-bingo-game
- Owner: toreylittlefield
- Created: 2021-12-08T00:47:53.000Z (about 3 years ago)
- Default Branch: main
- Last Pushed: 2023-03-07T09:06:28.000Z (almost 2 years ago)
- Last Synced: 2023-07-07T13:42:36.121Z (over 1 year ago)
- Topics: bingo-game, chat-application, faunadb, netlify, netlify-identity, next, nextjs, pusher, react, reactjs, real-time, typescript
- Language: TypeScript
- Homepage: https://torey-next-bingo-pusher.netlify.app/
- Size: 4.37 MB
- Stars: 2
- Watchers: 2
- Forks: 1
- Open Issues: 13
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
[![Contributors][contributors-shield]][contributors-url]
[![Forks][forks-shield]][forks-url]
[![Stargazers][stars-shield]][stars-url]
[![Issues][issues-shield]][issues-url]
[![MIT License][license-shield]][license-url]
[![LinkedIn][linkedin-shield]][linkedin-url]
Table of Contents
## About The Project
[![Product Name Screen Shot][product-screenshot]](https://example.com)
[![Architectural Diagram][cloud-craft-image]](https://app.cloudcraft.co/view/a448ab57-939a-4379-850b-15b4273e4ae4?key=f8e4f7cd-1b29-481c-b107-3e28bad0dc6f&interactive=true&embed=true)
[![Architectural Diagram Interactive Version - Cloud Craft][cloud-craft-embed]](https://app.cloudcraft.co/view/a448ab57-939a-4379-850b-15b4273e4ae4?key=f8e4f7cd-1b29-481c-b107-3e28bad0dc6f&interactive=true&embed=true)
Here's a blank template to get started: To avoid retyping too much info. Do a search and replace with your text editor for the following: `github_username`, `next-bingo-game`, `twitter_handle`, `linkedin_username`, `email`, `email_client`, `project_title`, `project_description`
### Built With
- [Next.js](https://nextjs.org/)
- [React.js](https://reactjs.org/)
- [Chakra UI](https://chakra-ui.com/) React / Next Component Library
- [Netlify Identity Widget](https://github.com/netlify/netlify-identity-widget) for Netlify Identity Authorization
- [Pusher.js](https://github.com/pusher/pusher-js) for serverless websockets
- [Fauna](https://docs.fauna.com/fauna/current/) for serverless database
## Getting Started
This is an example of how you may give instructions on setting up your project locally.
To get a local copy up and running follow these simple example steps.
### Prerequisites
This is an example of how to list things you need to use the software and how to install them.
- npm
```sh
npm install npm@latest -g
```
### Installation
1. Get a free API Key at [https://example.com](https://example.com)
2. Clone the repo
```sh
git clone https://github.com/github_username/repo_name.git
```
3. Install NPM packages
```sh
npm install
```
4. Enter your API in `config.js`
```js
const API_KEY = 'ENTER YOUR API';
```
## Usage
Use this space to show useful examples of how a project can be used. Additional screenshots, code examples and demos work well in this space. You may also link to more resources.
_For more examples, please refer to the [Documentation](https://example.com)_
## Roadmap
- [ ] Feature 1
- [ ] Feature 2
- [ ] Feature 3
- [ ] Nested Feature
See the [open issues](https://github.com/github_username/repo_name/issues) for a full list of proposed features (and known issues).
## Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!
1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
## License
Distributed under the MIT License. See `LICENSE.txt` for more information.
## Contact
Your Name - [@twitter_handle](https://twitter.com/twitter_handle) - email@email_client.com
Project Link: [https://github.com/github_username/repo_name](https://github.com/github_username/repo_name)
## Acknowledgments
- []()
- []()
- []()
[contributors-shield]: https://img.shields.io/github/contributors/toreylittlefield/next-bingo-game.svg?style=for-the-badge
[contributors-url]: https://github.com/toreylittlefield/next-bingo-game/graphs/contributors
[forks-shield]: https://img.shields.io/github/forks/toreylittlefield/next-bingo-game.svg?style=for-the-badge
[forks-url]: https://github.com/toreylittlefield/next-bingo-game/network/members
[stars-shield]: https://img.shields.io/github/stars/toreylittlefield/next-bingo-game.svg?style=for-the-badge
[stars-url]: https://github.com/toreylittlefield/next-bingo-game/stargazers
[issues-shield]: https://img.shields.io/github/issues/toreylittlefield/next-bingo-game.svg?style=for-the-badge
[issues-url]: https://github.com/toreylittlefield/next-bingo-game/issues
[license-shield]: https://img.shields.io/github/license/toreylittlefield/next-bingo-game.svg?style=for-the-badge
[license-url]: https://github.com/toreylittlefield/next-bingo-game/blob/master/LICENSE.txt
[linkedin-shield]: https://img.shields.io/badge/-LinkedIn-black.svg?style=for-the-badge&logo=linkedin&colorB=555
[linkedin-url]: https://linkedin.com/in/toreylittlefield
[product-screenshot]: images/screenshot.png
[cloud-craft-embed]: https://app.cloudcraft.co/view/a448ab57-939a-4379-850b-15b4273e4ae4?key=f8e4f7cd-1b29-481c-b107-3e28bad0dc6f&interactive=true&embed=true
[cloud-craft-image]: ./assets/architectural_diagram.svg
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:
```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.tsx`. The page auto-updates as you edit the file.
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
## 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.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
## Deploy on Vercel
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.
