- Pull the image
docker pull paulenokels/eukapay-todo-app:latest
- run
docker run -p 3000:3000 paulenokels/eukapay-todo-app:latest
- Visit http://localhost:3000 to see the app.
-
Clone this repository
-
Install yarn if you dont have
npm install --global yarn
- Install required packages
yarn install
- Start the application
yarn dev
- Visit http://localhost:3000 to see the app.
yarn test
The main app directory structure is arranged like this:
src
|---components
|---pages
|---interfaces
|---services
|---styles
|---context
|---utils
this folder contains global shared/reusable components, such as layout (wrappers, navigation), form components, buttons, etc
components
|---Footer
|---Header
|---Layout
|---TodoItems
NextJS enforce having all routes in a folder named pages, this allows for file system based router.
pages
|---api
|---edit
|---_app.tsx_
|---index.tsx
This folder contains type interfaces that can be shared between the server and the client
interfaces
|---todoItem.type.ts
contains APIs that connects the application with the outside world. Any form of API call or websocket interaction which needs to happen, to share data with an external service or client, is saved here.
services
|---todoService.ts
This folder stores all CSS shared across the App. styles
|---_constants.scss
|---global.scss
The contexts folder is a bare minimum folder only containing the state which has to be shared across these components. Each page can have several nested contexts, with each context only passing the data forward in a downward direction. This structure will look like this:
contexts
|---todo
|---todo-context.tsx
Stores Utilities, helpers, constants, and the like
utils
|---constants.ts
|---notify.ts