https://github.com/sevlamare/topstocks
Check the top NASDAQ stocks in great style with this React application.
https://github.com/sevlamare/topstocks
babel css-modules cypress express javascript jest react react-router redux webpack
Last synced: 3 months ago
JSON representation
Check the top NASDAQ stocks in great style with this React application.
- Host: GitHub
- URL: https://github.com/sevlamare/topstocks
- Owner: SevlaMare
- Created: 2020-10-07T14:52:29.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2020-11-07T16:35:14.000Z (over 4 years ago)
- Last Synced: 2025-02-04T14:50:13.838Z (4 months ago)
- Topics: babel, css-modules, cypress, express, javascript, jest, react, react-router, redux, webpack
- Language: JavaScript
- Homepage: https://stock-catalogue.herokuapp.com/
- Size: 1.64 MB
- Stars: 3
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Top Stocks
> A catalog like build with React and Redux, to display the top stocks from NASDAQ.
This project was made to practice all aspects involved in creating a React application.
## Content
* [Live Demo](#live-demo)
* [Requirements](#requirements)
* [Requisites](#built-with)
* [Built With](#built-with)
* [Future Improvements](#future-improvements)
* [Getting Start](#getting-start)
* [Contributing](#contributing)
* [Author](#author)
* [License](#license)
## Live Demo
You can access an online version at:
https://stock-catalogue.herokuapp.com/
And video presentation:
https://www.youtube.com/watch?v=hBO2cOWX7-w
## Requirements
- [x] Implement a catalog with React and Redux
- [x] Setup workflow (Without create-react-app)
- [x] Fetch data from API and store into Redux
- [x] It should have routes and nested routes
- [x] Stateless filter to slice the data
- [x] Make use of Hooks and only functional components
- [x] Deploy it live
## Requisites
* [A modern web browser](https://www.google.com/chrome/)
* [Node JS](https://nodejs.org/en/download/)
## Built With
- Javascript
- HTML/CSS
- React and Redux
- Express
- Webpack and babel
- JEST and React testing library for tests
- Cypress for e2e tests
- ESlint and Stylelint (Linters)
- GitHub Actions (CI Tool)
- Netlify (Server and CD tool)
- Git, Github and VScode
## Future Improvements
- Realtime chart from state
- More filters
- Loading animation while fetching
## Getting Start
#### Get a local copy
Now you need a copy of this application, if you are using Git:
```js
git clone [email protected]:SevlaMare/Catalogue.git
```
Otherwise just hit (Download Zip) on the green button (Code) at top of this page.
#### Open terminal
Open your terminal inside the game folder, and paste the following commands:
#### Download all dependencies
```js
npm install
```
#### Compile
```js
npm run build
```
#### Start the server
```js
npm run go
```
#### Go to a web browser (Like Google Chrome) and visit:
```js
localhost:7000
```
#### Run tests
Unit and integration tests
```npm run test```
E2E, first, need the app running:
```npm run build```
```npm run go```
and so run tests
```npm run e2e```
## Contributing
Contributions, issues and feature requests are welcome!
You can do it on [issues page](issues/).
### Acknowledgments
A special thanks to the code reviewers.
## Author
👤 **Thiago Miranda**
- Github: [@SevlaMare](https://github.com/SevlaMare)
- Twitter: [#SevlaMare](https://twitter.com/SevlaMare)
- Linkedin: [SevlaMare](https://www.linkedin.com/in/sevla-mare)
## License
Design idea based on Catalogue of Dog Clothes by [Denys Chagaida on Behance](https://www.behance.net/chagaida)
#### MIT