This web version allow NGOs to register yourself and manage its incidents. All the resources used by this application comes from its API.
Click to expand.
Easy peasy lemon squeezy:
$ yarn
Or:
$ npm install
Was installed and configured the
eslintandprettierto keep the code clean and patterned.
Configure your environment variables and remember to start the API before to start this app.
In this file you may configure the API's url. Rename the .env.example in the root directory to .env then just update with your settings.
| key | description | default |
|---|---|---|
| REACT_APP_API_URL | API's url with version (v1) | http://localhost:3333/v1 |
Start the API (see its README for more information). In case of any change in the API's port or host remember to update the .env too.
To start the app run:
$ yarn start
Or:
npm run start
The project comes configured with Reactotron, after install just open it, then as soon as possible Reactotron will automatically identify new connections.
Maybe be necessary refresh the page.
When registering a new NGO notice that after send the form data a success toast message will appers at the right top corner of the screen with the NGO's ID, memorize or note it. At login page just paste the ID in the input and press ENTER or click on the button below to login.
The project saves NGO's data into a localStorage key: bethehero. Before use this data you need parse the data to a JavaScript object with JSON.parse function. Below you can see fictitious data:
{
"id": "98a111d1",
"name": "NGO Doe",
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJzdWIiOiIxMjM0NTY3ODkwIiwibWVzc2FnZSI6IkVhZSwgdHVkbyBibHo_IiwiaWF0IjoxNTE2MjM5MDIyfQ.MgLoxvRXoXeEHv36H4KuUQ3kfVl66uSOzJYll2IsZHE"
}Jest was the choice to test the app, to run:
$ yarn test
Or:
$ npm run test
You can see the coverage report inside tests/coverage. They are automatically created after the tests run.