The project is bootstrapped with
create-react-app
cli, with typescript extension.
src/index
: Entry point file for our applicationsrc/App
: Components entry point with routingsrc/utils
: Helperssrc/xhr
: XHR helperssrc/configureStore
: global state management configurationsrc/types
: Types for application level like Redux State, Redux Actions etcpublic
: Global assets like css, index.html, favicon, manifest etcsrc/****
: Different modules (routes) in our application
- System requirements
npm^6.7.0
- Knowledge requirements
typescript@3.3.3
: attach the typings to our codebasereact@16.8.2
: component library@reach/router@1.2.1
: router for reach with accessibility in mindredux@4.0.1
: state managementreact-redux@6.0.1
: state management helper for reactredux-thunk
: side effects for redux actionsformik
: form state managementyup
: data validationaxios
: helper for xhr@tourepedia/ui
: ui component library for tourepediacommitizen
: craft your commit message with proper attributes
- Clone the repository and install the dependencies
git clone git@github.com:tourepedia/tp-admin-ui.git
cd tp-admin-ui
npm install
npm start
npm start # to start the development server
npm run test # to run the unit tests
npm run cypress # to run any E2E tests
npm run cypress:all # to run all E2E tests
npm run commit # to commit the changes
npm run release # to release a new version, make sure to have a personal token in your .env file
npm run deploy:testing # deploy to gh-pages__test branch
Let's support we are creating a new Module called Role Management
. This module will have following functionalities:
- Show list of items
- Show details for an item
- Create a new item
You can look into the
src/Roles
directory for reference.
We will start by creating a new Folder inside src
directory, named Roles
with a index.tsx
file in it which will
contain all the exports from Roles management module.