Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/diegovictor/ecoleta-web

Project built during Rocketseat's Next Level Week #1
https://github.com/diegovictor/ecoleta-web

coverage-report ecoleta javascript jest js nlw nlw-booster node nodejs reacjs react rocketseat ts typescript web

Last synced: about 2 months ago
JSON representation

Project built during Rocketseat's Next Level Week #1

Awesome Lists containing this project

README

        

# [Web] Ecoleta
![CircleCI](https://img.shields.io/circleci/build/github/DiegoVictor/ecoleta-web?style=flat-square&logo=circleci)
[![typescript](https://img.shields.io/badge/typescript-4.1.3-3178c6?style=flat-square&logo=typescript)](https://www.typescriptlang.org/)
[![reactjs](https://img.shields.io/badge/reactjs-16.13.1-61dafb?style=flat-square&logo=react)](https://reactjs.org/)
[![styled-components](https://img.shields.io/badge/styled_components-5.1.1-db7b86?style=flat-square&logo=styled-components)](https://styled-components.com/)
[![eslint](https://img.shields.io/badge/eslint-6.8.0-4b32c3?style=flat-square&logo=eslint)](https://eslint.org/)
[![airbnb-style](https://flat.badgen.net/badge/style-guide/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)
[![jest](https://img.shields.io/badge/jest-26.6.3-brightgreen?style=flat-square&logo=jest)](https://jestjs.io/)
[![coverage](https://img.shields.io/codecov/c/gh/DiegoVictor/ecoleta-web?logo=codecov&style=flat-square)](https://codecov.io/gh/DiegoVictor/ecoleta-web)
[![MIT License](https://img.shields.io/badge/license-MIT-green?style=flat-square)](https://raw.githubusercontent.com/DiegoVictor/ecoleta-web/main/LICENSE)
[![PRs Welcome](https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square)](http://makeapullrequest.com)

This web version allow entities to register yourself and select the types of items that its point collect. All the resources used by this application comes from its [`API`](https://github.com/DiegoVictor/ecoleta-api).

## Table of Contents
* [Screenshots](#screenshots)
* [Installing](#installing)
* [Configuring](#configuring)
* [.env](#env)
* [API](#api)
* [Usage](#usage)
* [Running the tests](#running-the-tests)
* [Coverage Report](#coverage-report)

# Screenshots
Click to expand.

![home](https://raw.githubusercontent.com/DiegoVictor/ecoleta-web/main/screenshots/home.png)
![register](https://raw.githubusercontent.com/DiegoVictor/ecoleta-web/main/screenshots/register.png)
![success](https://raw.githubusercontent.com/DiegoVictor/ecoleta-web/main/screenshots/success.png)

# Installing
Easy peasy lemon squeezy:
```
$ yarn
```
Or:
```
$ npm install
```
> Was installed and configured the [`eslint`](https://eslint.org/) and [`prettier`](https://prettier.io/) to keep the code clean and patterned.

## Configuring
Configure your environment variables and remember to start the [API](https://github.com/DiegoVictor/ecoleta-api) before to start this app.

### .env
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`

### API
Start the [API](https://github.com/DiegoVictor/ecoleta-api) (see its README for more information). In case of any change in the API's `port` or `host` remember to update the [`.env`](#env) too.

# Usage
To start the app run:
```
$ yarn start
```
Or:
```
$ npm run start
```

# Running the tests
[Jest](https://jestjs.io) was the choice to test the app, to run:
```
$ yarn test
```
Or:
```
$ npm run test
```

## Coverage report
You can see the coverage report inside `tests/coverage`. They are automatically created after the tests run.