From a91d37ad518bba9c6f9fb3e27c23e000b391f722 Mon Sep 17 00:00:00 2001 From: Julio Muller Date: Sun, 25 Oct 2020 02:48:43 -0300 Subject: [PATCH] Updated docs --- README.md | 57 ++++++++++++++++++++++++++++++++++--------------------- 1 file changed, 35 insertions(+), 22 deletions(-) diff --git a/README.md b/README.md index 4f9a9cf..0ff5a10 100644 --- a/README.md +++ b/README.md @@ -2,11 +2,24 @@ :izakaya_lantern: Marvel Characters Search App -- **Project developed by:** [Julio L. Muller](https://github.com/juliolmuller) -- **Released on:** Jul 31, 2019 -- **Updated on:** Aug 25, 2020 -- **Latest version:** 1.1.0 -- **License:** MIT +

+ Objectives   |    + Lessons Learned   |    + Technologies   |    + Environment Setup +

+ +

+ Creation Date + + Update Date + + Latest Version + + Pull Requests Welcome + + Project License +

![Marvel Characters snapshot](./src/assets/images/app-overview.jpg) @@ -16,21 +29,21 @@ This application was proposed by [Juno](https://www.juno.com.br/), as part of th ## :pencil: Objectives -- :heavy_check_mark: Display a search input for the user to query API based on `nameStartsWith`; -- :heavy_check_mark: Display search result (summarized); -- :heavy_check_mark: When opening an item, display its details; -- :heavy_check_mark: Display responsive thumbnails (that better fits the screen) for the items which has it; -- :heavy_check_mark: Interface MUST be responsive; -- :heavy_check_mark: The final project must contain a `.MD` file with specifications of the project. -- :heavy_check_mark: Develop the application using React and Node.js (with ES6+) +- [x] Display a search input for the user to query API based on `nameStartsWith`; +- [x] Display search result (summarized); +- [x] When opening an item, display its details; +- [x] Display responsive thumbnails (that better fits the screen) for the items which has it; +- [x] Interface MUST be responsive; +- [x] The final project must contain a `.MD` file with specifications of the project. +- [x] Develop the application using React and Node.js (with ES6+) ### Optional bonus -- :heavy_check_mark: Pagination; -- :warning: SASS (implemented for Bootstrap and additional styles customization); -- :x: Transitions; -- :heavy_check_mark: Project watchers and routines with Node.js and other environmental utilities; -- :x: Unit tests by componnent. +- [x] Pagination; +- [x] SASS (implemented for Bootstrap and additional styles customization); +- [ ] Transitions; +- [x] Project watchers and routines with Node.js and other environmental utilities; +- [ ] Unit tests by componnent. ## :trophy: Lessons Learned @@ -40,10 +53,10 @@ This application was proposed by [Juno](https://www.juno.com.br/), as part of th - React with TypeScript (at version 1.1); - React Hooks (at version 1.1); -## :hammer: Technologies & Resources +## :rocket: Technologies & Resources **Frontend:** -- [React 16.13](https://reactjs.org) +- [React ~~16.9~~17](https://reactjs.org) - [Bootstrap 4](https://getbootstrap.com/) - [jQuery 3](https://jquery.com/) - [Axios](https://github.com/axios/axios) (HTTP client) @@ -53,14 +66,14 @@ This application was proposed by [Juno](https://www.juno.com.br/), as part of th - [Cmder](https://cmder.net/) (terminal emulator) - [Node.js](https://nodejs.org/en/) scripts (with Laravel Mix) -## :bell: Setting up the Environment +## :hammer: Setting up the Environment -To execute the application, you must have a Marvel Developer account and have the **public** and **private** keys generated. Once you have them, you will need to rename the file `env.js.example` (in `src/config/`) to simply `env.js`, and input the keys in their appropriate location. +To execute the application, you must have a Marvel Developer account and have the **public** and **private** keys generated. Once you have them, you will have to register both as environmental variables in `.env` file, at project root (I suggest to create a copy called `.env.local` to keep it out from Git repository). Make sure to have **Node.js 10+** installed in your machine and its **npm** available in the command line, then use the following routines: ```bash $ npm install # Download dependencies -$ npm run serve # Run development server +$ npm start # Run development server $ npm run build # Build files for production ```