Project Bobobox Frontend

Project for Bobobox Frontend Development

Tech Stack

• NextJS, a React Framework
• TailwindCSS, a CSS Framework
• React-Hooks, a React Hooks Library
• Recoil, a React State Management Library
• Jest, a Testing Framework
• React Testing Library, a Testing Library for React
• Prettier, a Code Formatter
• Eslint, a Code Linter
• Typescript, a TypeScript Compiler

Demo

Demo Website

Run Locally

Clone the project

  git clone https://github.com/naufaldi/bobobox-test

Go to the project directory

  cd bobobox-test

Install dependencies

  npm install

Start the server

  npm run dev

Folder Structure

├── dist                    # Compiled files
├── public                  # Public files
├── src                     # Source files
│ ├── components            # all of component files
| |     ├── common          # component related to common like button / alert
│ |     ├── homepage        # component base on usage in homepage pages
│ |     ├── layout          # component base on layout like header, and footer,
│ |     └── pokemon         # component base on usage in pokemon detail pages
│ ├── lib                   # test and helper
| |     ├── __test__        # test files
| |     └── helpers         # helper functions
│ ├── pages                 # pages files
│ ├── recoil                # Global State
│ ├── styles                # Style file
│ └─── types                # Type data
└── README.md

Preview