Djordje Mitrovic
3 年之前
+ 52
- 41
README.md
查看文件
| # Getting Started with Create React App | |||||
| # Trampa API Frontend | |||||
| This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). | |||||
| ## Available Scripts | |||||
| Welcome to frontend application for trampa website. In next sections we will walk you through our project, setting it up on your computer, building it for production and last but not the least walk you through tools that we used: | |||||
| In the project directory, you can run: | |||||
| - [Description](#Description) | |||||
| - [Setup](#Setup) | |||||
| - [Tools](#Tools) | |||||
| ### `npm start` | |||||
| # Description | |||||
| This is an internal project for e-commerce website called Trampa that was done by Diligent. | |||||
| Our project is hosted on our local [git](https://git.dilig.net/selenaaasi/trampa-frontend) | |||||
| Runs the app in the development mode.\ | |||||
| Open [http://localhost:3000](http://localhost:3000) to view it in the browser. | |||||
| ## Tech stack | |||||
| The page will reload if you make edits.\ | |||||
| You will also see any lint errors in the console. | |||||
| In this project we used Node and N(ode)P(ackage)M(anager) for initializing project | |||||
| and importing a lot of libraries that helps us developing. | |||||
| ### `npm test` | |||||
| This project was bootstrapped with [Create React App](https://github.com/facebook/create-react-app). | |||||
| Every HTTP request is implemented via Axios, and for handling asynchronous code we used Saga. | |||||
| Launches the test runner in the interactive watch mode.\ | |||||
| See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. | |||||
| ## Node Package Manager | |||||
| ### `npm run build` | |||||
| In order to run this project you need to install Node that comes with its Package Manager. | |||||
| Please follow the official tutorial on installing Node which can be found on this link: | |||||
| > https://docs.npmjs.com/downloading-and-installing-node-js-and-npm | |||||
| Builds the app for production to the `build` folder.\ | |||||
| It correctly bundles React in production mode and optimizes the build for the best performance. | |||||
| ## Development environment | |||||
| - [Visual Studio Code](https://code.visualstudio.com/Download) - Used as the primary code editor | |||||
| - [npm](https://www.npmjs.com/) - Used for installing node and running our application | |||||
| - [git](https://git-scm.com/downloads) | |||||
| The build is minified and the filenames include the hashes.\ | |||||
| Your app is ready to be deployed! | |||||
| # Setup | |||||
| See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. | |||||
| Here we will show you how to set up project and run it in localhost. | |||||
| ## Project setup | |||||
| In order to run our project you need to clone it from [git](https://git.dilig.net/selenaaasi/trampa-frontend.git) first. Open terminal (cmd and powershell work as well) in folder that you want this project to be and run command | |||||
| > git clone http://git.dilig.net/selenaaasi/trampa-frontend.git | |||||
| ### `npm run eject` | |||||
| After cloning project you can open it with your preferred IDE/Code editor if you want to see the code. Before running project you need to open terminal and run command | |||||
| > npm install | |||||
| **Note: this is a one-way operation. Once you `eject`, you can’t go back!** | |||||
| Running that command will download all necessary npm packages to run the project. | |||||
| If you aren’t satisfied with the build tool and configuration choices, you can `eject` at any time. This command will remove the single build dependency from your project. | |||||
| Now your project is ready for setup on both local and production environment. | |||||
| Instead, it will copy all the configuration files and the transitive dependencies (webpack, Babel, ESLint, etc) right into your project so you have full control over them. All of the commands except `eject` will still work, but they will point to the copied scripts so you can tweak them. At this point you’re on your own. | |||||
| ### Local project setup | |||||
| You don’t have to ever use `eject`. The curated feature set is suitable for small and middle deployments, and you shouldn’t feel obligated to use this feature. However we understand that this tool wouldn’t be useful if you couldn’t customize it when you are ready for it. | |||||
| You can run the project using | |||||
| > npm start | |||||
| ## Learn More | |||||
| Congratulations! You now run website application on following website: | |||||
| > http://localhost:3000/ | |||||
| You can learn more in the [Create React App documentation](https://facebook.github.io/create-react-app/docs/getting-started). | |||||
| ### Production project setup | |||||
| To learn React, check out the [React documentation](https://reactjs.org/). | |||||
| You can make the production build using | |||||
| > npm run build | |||||
| ### Code Splitting | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/code-splitting](https://facebook.github.io/create-react-app/docs/code-splitting) | |||||
| ### Analyzing the Bundle Size | |||||
| Congratulations! You now have production build which is ready for deploy! | |||||
| The build is minified and the filenames include the hashes. | |||||
| It correctly bundles React in production mode and optimizes the build for the best performance. | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size](https://facebook.github.io/create-react-app/docs/analyzing-the-bundle-size) | |||||
| When your application is deployed you can run it using: | |||||
| > npx serve -s build | |||||
| ### Making a Progressive Web App | |||||
| See the section about [deployment](https://facebook.github.io/create-react-app/docs/deployment) for more information. | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app](https://facebook.github.io/create-react-app/docs/making-a-progressive-web-app) | |||||
| # Testing | |||||
| Here we will show you how to run tests and see code coverage | |||||
| ### Advanced Configuration | |||||
| ## Testing framework | |||||
| We needed to write tests, unit, integration and E2E. Framework that we used for that is called [jest](https://www.npmjs.com/package/jest). | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/advanced-configuration](https://facebook.github.io/create-react-app/docs/advanced-configuration) | |||||
| When we write our tests we can use following comand: | |||||
| > npm test | |||||
| ### Deployment | |||||
| which launches the test runner in the interactive watch mode.\ | |||||
| See the section about [running tests](https://facebook.github.io/create-react-app/docs/running-tests) for more information. | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/deployment](https://facebook.github.io/create-react-app/docs/deployment) | |||||
| ### `npm run build` fails to minify | |||||
| This section has moved here: [https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify](https://facebook.github.io/create-react-app/docs/troubleshooting#npm-run-build-fails-to-minify) |
Loading…