Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sreehari2003/growwstonks
Stock market demo using Alphavantage api - Internship assignment for groww.com
https://github.com/sreehari2003/growwstonks
Last synced: 20 days ago
JSON representation
Stock market demo using Alphavantage api - Internship assignment for groww.com
- Host: GitHub
- URL: https://github.com/sreehari2003/growwstonks
- Owner: sreehari2003
- Created: 2023-10-25T15:54:31.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-10-31T14:48:46.000Z (about 1 year ago)
- Last Synced: 2024-11-01T20:05:23.108Z (2 months ago)
- Language: TypeScript
- Homepage: https://growwstonks-drab.vercel.app/
- Size: 21.5 MB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
### Internship task for groww.in
### Built With
- Next js
- Typescript
- React query
- Tailwind css
- Radix ui for dialog
- Ant icons
### Folder structure
```
project structure/
├── hooks
│ ├── api - all api calls as react query hook
│ └── all normal react hooks
├── components - all components that are used in more than one page
└── layout - contain all diffrent layout specific code
└── views - contain all page specific components
├── utils - contains all utility functions
└── config - contains envs and end points
├── utils - contains all utility functions
└── pages - all website pages
```
## Demo
https://github.com/sreehari2003/growwstonks/assets/66205494/2729c2de-8e95-4a31-8762-09c1efe362ea
## Project
### Layout structue
- to prevent repetition of code i have used special type layout structure for each layout when we does this
```js
Home.Layout = HomeLayout;
export default Home;
```
- in _app.tsx it wraps the code like this
```js
{Component.Layout ? (
) : (
)}
```
### Bundle size
since the code is only 2 page i have made sure not to use unwanted dependecy , becuase of this the total bundle size is very less
### Server side rendering
- the more info page is loaded via server side rendering , it fetch the company info before the page is renderd
### Typescript
- code is 100% type defined , this helps for better maintainibilty
### Images
### Dependency
### Prerequisites
You need to install
1. [Node v16](https://nodejs.org/en/)
2. [npm](https://pnpm.io/)
### Installation
1. Clone the repo
```sh
git clone https://github.com/sreehari2003/growwstonks
```
2. Install all the NPM packages all the applications.
```sh
npm install
```
3. Copy the `.env.example` for each applications to `.env` in the same directory and fill the values required
4. Start the web application dev server and open `http://localhost:3000`
```sh
npm run dev
```
## Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!
1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request