https://github.com/victorcmarinho/archref-reactjs-typescript

A simple archt ref for ReactJS with TypeScript 🛠
https://github.com/victorcmarinho/archref-reactjs-typescript

Last synced: 2 months ago
JSON representation

A simple archt ref for ReactJS with TypeScript 🛠

• Host: GitHub
• URL: https://github.com/victorcmarinho/archref-reactjs-typescript
• Owner: victorcmarinho
• Created: 2020-12-06T20:12:48.000Z (almost 5 years ago)
• Default Branch: master
• Last Pushed: 2020-12-06T19:03:22.000Z (almost 5 years ago)
• Last Synced: 2025-02-26T16:50:36.422Z (7 months ago)
• Homepage:
• Size: 217 KB
• Stars: 2
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# React Reference Architecture

## Develop

`npm start`

[https://localhost:3000]

## Build

`npm run build`

## Unit Tests

`npm test`

**This is your source code tree:**

```

src

|-- assets

|-- components

|-- pages

|-- routes

|-- services

|-- utils

|-- App.tsx

|-- index.tsx

...

```

Every item created inside components,  pages... will be a folder with their code, the tests file, and to keep your code simple and short you can add extra files for helpers or styles it this folder. The folder structure will look like this:

```

...

components

|-- YourComponent

    |-- index.tsx

    |-- styles.ts

    |-- YourComponent.test.ts

...

```

`./assets`

Here will be all your project assets as images, icons...

`./components`

Components are presentational only elements, grouping UI items

`./pages`

Pages are mapped in routes and have all the containers needed to implement a functionality

`./routes`

Routes contains the `react-router-dom` implementation to map the project's routes to the respective pages

`./services`

Services are responsible to handle the connection with all external elements, like APIs

`./utils`

Directory to keep all utils functions to share all over the project