jb-commons

📄 About the project

This project is sharing 100% of code (components and pages) to web and mobile. All the components are created using React-native and styled-components/native. Let's check the file structure.

⚙️ Tech stack

• React Native
• Typescript
• Styled Components
• React Testing Library
• Jest
• ESLint

🧐 What's inside?

.
├── __mocks__
├── @types
├── node_modules/
├── src/
    |-- __tests__/
    |-- assets/
    |-- components/
    |-- pages/
    |-- styles/
    |-- utils/
    |-- App.tsx
    |-- AppHeader.tsx
├── .editorconfig
├── babel.config.js
├── global.d.ts
├── jest.config.js
├── package.json
├── styled.d.ts
├── README.md
└── tsconfig.json

1. mocks: Contain only the configuration to SVG.

2. @types: Module declarations to images.

3. node_modules/: This directory contains all of the modules of code that your project depends on (npm/yarn packages) are automatically installed.

4. src/: This directory will contain all of the code related to what you will see on the front-end and mobile, such as your site/app header or a page template. src is a convention for “source code”.

   • 4.1. tests: Here you can create all tests to components/pages that aren't into components/.
   • 4.2. assets/: Here's all the icons that we use in the project and the logo.
   • 4.3. components/: This directory contains all of the components that are shared with the web and app.
   • 4.4. pages/: This directory contains all of the pages that are shared to the web and app.
   • 4.5. styles/: Here you can create files that represent the theme of to project.
   • 4.6. utils/: You can create files, functions, and test that is related to src directory.
   • 4.7. App.tsx: This file is called when you need to create a page, this file is a wrapper that contains the `theme provider

5. .editorconfig: This file keeps the project formatted into all code editors.

6. babel.config.js: Here we set all presets and plugins to parser code.

7. global.d.ts: File that keeps all decorations off modules to project.

8. jest.config.js: Here is imported the jest config base and add some things to run all the tests.

9. package.json: A manifest file for Node.js projects, which includes things like metadata (the project’s name, author, etc). This manifest is how npm knows which packages to install for your project.

10. styled.d.ts: Global declaration to the default theme.

11. README.md: A text file containing useful reference information about your project.

12. tsconfig.json: All the configuration to parser the typescript.