Description

The project simulates an e-commerce for buying and selling books and stationery. Made with Typescript and React, it gets data from the application backend.

---

Content Table

• Description
• Content Table
• Getting Started
• Running and Building the App
• Heroku
• Structure
• Technologies
• License

---

Getting Started

Before continue, be sure to have Git and Node.js installed.

To clone the repository, use:

$ git clone 'https://github.com/paperbook-official/web.react.paperbook.git'

Then, install all of it's dependencies:

$ npm install

For VSCode developers, it's also highly recommended to install some extensions:

• ESLint
• Prettier - Code formatter
• vscode-styled-components

---

Running and Building the App

To run the app in development mode:

$ npm start

Building the app for production:

$ npm run build

---

Heroku

The project uses Heroku to host it's development version. It can be accessed by clicking here.

To send the app to Heroku, first create a file named .env.local and put in it the template bellow:

PORT = 3000;

The PORT is not fixed and may be changed

Then, add the Heroku repository:

$ git remote add heroku https://git.heroku.com/heroku-app-name-here.git

$ git checkout master
$ git merge develop

$ git push heroku master

---

Structure

The project uses the atomic design pattern to organize it's components, so be sure to select the correct folder according to the pattern's concepts.

Ex.: creating the Button, ListItem and List components:

• components
  • atoms
    • Button
      • index.tsx
      • styles.ts
  • molecules
    • ListItem
      • index.tsx
      • styles.ts
  • organisms
    • List
      • index.tsx
      • styles.ts

---

Technologies

• React
• Typescript
• Styled Components

---

License

The PaperBook project is licensed under the MIT license.