https://github.com/italoh623/ignews
A React web app to post article about ReactJs
https://github.com/italoh623/ignews
blog cms payment react ssp ssr stripe-api yarn
Last synced: over 1 year ago
JSON representation
A React web app to post article about ReactJs
- Host: GitHub
- URL: https://github.com/italoh623/ignews
- Owner: italoh623
- Created: 2021-03-25T12:22:59.000Z (over 5 years ago)
- Default Branch: main
- Last Pushed: 2021-12-09T22:54:36.000Z (over 4 years ago)
- Last Synced: 2024-10-24T15:39:56.385Z (over 1 year ago)
- Topics: blog, cms, payment, react, ssp, ssr, stripe-api, yarn
- Language: TypeScript
- Homepage: ignews-italoh623.vercel.app
- Size: 725 KB
- Stars: 0
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
ig.news
ig.news is a blog about ReactJs developed in the Ignite Bootcamp by RocketSeat.
# Getting Started
These instructions will get you a copy of the full project up and running on your local machine for development and testing purposes.
The project must be built with npm, so download it below if you don't have any installed on your system.
* **Npm** is distributed with Node.js which means that when you download Node.js, you automatically get npm installed on your computer. [Download Node.js](https://nodejs.org/en/download/)
* **Yarn** is a package manager built by Facebook Team and seems to be faster than npm in general. [Download Yarn](https://yarnpkg.com/en/docs/install)
To run this server you will need a node version 12.0.0 (minimum)
## Stripe
This project uses Stripe api as Payment sistem so you'll neeed to create a [Stripe account](https://stripe.com/br) with a Product registred.
### Stripe CLI
Stripe CLI is a tools to recive stripe webhooks in
development environment. To install follow the [documentation](https://stripe.com/docs/stripe-cli).
After you must run the following command in terminal to start to listen the webhooks:
```
$ stripe listen --forward-to localhost:3000/api/webhooks
```
Finally you must add this lines to `.env.local` file:
```js
STRIPE_API_KEY= // Api key
NEXT_PUBLIC_STRIPE_PUBLIC_KEY= // Public key
STRIPE_WEBHOOK_SECRET= // Webhook signing secret
STRIPE_SUCCESS_URL=http://localhost:3000/posts
STRIPE_CANCEL_URL=http://localhost:3000/
```
## Prismic
[Prismic](https://prismic.io) is a Content Management System, a tool for editing online content.
You must create a account and a new Type `Post` whith this format:

You need to create a private key for your prismic repository. Go to `Settings > API & Security > Repository ecurity` and select 'Private API'.
Finally you must add this line to `.env.local` file:
```js
PRISMIC_API_ENDPOINT= // Api endpoint
PRISMIC_ACCESS_TOKEN= // Api secret token
```
## FaunaDB
[FaunaDB](https://fauna.com/) is a flexible transactional database delivered as a secure and scalable cloud API with native GraphQL
You must create a account and a new database `Post` whith this collections and Indexes:

You must to create a private key to acess your fauna database. Go to `Security > Keys > + New Key` and select 'Private API'.
Finally you must add this line to `.env.local` file:
```js
FAUNADB_KEY= // Api secret key
```
# How to Install
* To download the project follow the instructions bellow:
1. `git clone https://github.com/italoh623/ignews.git`
2. `cd ignews`
* Install the dependencies and start the server:
3. `yarn install`
4. `yarn start` 🥳
# Screenshots
* Home Page

* Posts Page

* Post Preview Page

***The application still is in development 🚧. Soon this file will be updated with the deploy of the app and new features***
---
### Author

Ítalo Henrique Leça da Silva
[](https://www.linkedin.com/in/italo-leca/) [](mailto:italohenrique014@gmail.com)