Skip to content

Adalab/project-dorcas-s4-tpr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Adalab Sprint 4 Project

"Working with Triporate"

Our team is composed by Alexandra, Elísabet, Olatz, Irene and Olga.

This is our last project in Adalab, an intensive course of Front-End Development in Madrid. We have worked with Triporate, following the designs proposed by them. It's an intelligent platform that resolves all your company trip needs.

The project

The project is a form composed by five steps. It's an interactive form where you can switch from step to step. The user can complete personal and preference details about company travels

Getting started

How to download and start working with our project?

  • Clone this repository by writting on your terminal: git clone https://github.com/Adalab/dorcas-s4-tpr.git
  • Get into the folder of the repo writting: cd dorcas-s4-tpr
  • Install the required dependencies to use SASS by writting: $ npm install --save-dev node-sass-chokidar
  • Install some more dependencies: $ npm install --save-dev npm-run-all
  • Install Fontawesome writting: $ npm install --save-dev @fortawesome/fontawesome-free
  • Install React-Router: $ npm install —save react-router-dom
  • Install React-intl to work with internationalization:

    $ npm install react-intl $ npm install babel-plugin-react-intl $ npm run build

  • Install the following dependency to work with masked input: $ npm i react-text-mask --save

Structure

We have used React.js for our project. The first step to work with React is to check their official website and to follow the steps that they proposed: https://reactjs.org/docs/create-a-new-react-app.html React is composed by different components. Our first big decision was to decide what would be our components architecture. Once we took this decision we started working in the different steps of our project.

Internationalization

We have followed the instructions of the following link to install the internationalization in our project: https://medium.freecodecamp.org/setting-up-internationalization-in-react-from-start-to-finish-6cb94a7af725 Therefore our web app works in different languages: English and Spanish. It depends on your browser default language.

Axios

In order to consume the API that we use in our project, we have used Axios.

React-router

Our project is a Single Page Application (SPA) but we have used React router for navigating through it. Please, check out the next link if you need more help: https://reacttraining.com/react-router/web/example/basic

CSS

To compile all of our CSS documents we have used a preprocessor called SASS.

Our team is very grateful to be able to work with an actual company in such an enthusiastic project