Project developed during the OmniStack Week 10.0
MIT License
This web version allows users to register yourself, look for another users by technologies and see their GitHub profile information. 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
eslint
andprettier
to 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_URL | Utilized to created the redirect url to GitHub OAuth process | http://localhost:3000 |
REACT_APP_API_URL | API's url with version (v1) | http://localhost:3333/v1 |
REACT_APP_SOCKET_URL | API's socket url | http://localhost:3333 |
REACT_APP_MAP_LAT and REACT_APP_MAP_LNG | Where the map will center by default | - |
REACT_APP_GOOGLEMAP_API_KEY | API Key to allow Google Maps to be rendered (See Get an API Key) | - |
REACT_APP_GITHUB_CLIENT_ID | GitHub App Client ID (the same utilized in the API) | - |
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 saves user's data and token into a localStorage key: devradar
. Before use this data you need parse the data to a JavaScript object with JSON.parse
function. Below you can see fictitious data:
{
"_id": "60062bebde7800844cc23a26",
"avatar_url": "https://avatars3.githubusercontent.com/u/15165349?v=4",
"techs": "Node.js, React, ReactNative",
"latitude": -22.424944399999973,
"longitude": -46.979399400000005,
"token": "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjYwMDYyYmViZGU3ODAwODQ0Y2MyM2EyNiIsImlhdCI6MTYxMTAxODc4NywiZXhwIjoxNjExNjIzNTg3fQ.Ut25eM4tyFvBkhFf_Ox9qLhjLsKSyEjNYAKiReF-eBU"
}
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.