Building a Wizard / Workflow in React – Entelo Engineering

Building a Wizard / Workflow in React  #react #reactjs #tutorial #reactjs

  • Here are just a few examples:User Registration with multiple formsBreaking large forms into smaller stepsE-commerce checkout flowMulti-page surveysI’ve had previous experiences building out a checkout flow for e-commerce companies, but this was the first time I had to build a workflow using React.Here is the design and the approach I…
  • Finally, we end the workflow with a confirmation page.Each step of the workflow is a separate route we will define in our routes file when using react-router.
  • As we navigate from one step to the next, we will advance the progress bar along with rendering a new container with the next step’s contents.Choosing a Progress BarFor the progress bar, we decided to use the libraryThis is a very simple progress bar and the API is straightforward.
  • Below are some examples of what the progress bar looks like as we move from one step to the next.First StepNext Step to show progression in the workflowFinal StepReact RouterSet up the route to determine what step of the flow we are in.Route path=”jobs/:id/:step” /The id and step will be passed…
  • In the component, we will create a switch case statement to determine what component to render.switch (step) { case (‘description’): return (DescriptionContainer /); case (‘criteria’): return (CriteriaContainer /); …}We also use this stepvalue to calculate the progress bar distance and what progress label should be bold.ContainersWe have a series of…

One of my first tasks at Entelo was to work on a greenfield project that involved a step-by-step wizard. Workflows/wizards are useful when you want the end-user to complete a series of steps. (I’ll…
Continue reading “Building a Wizard / Workflow in React – Entelo Engineering”

Rail fleet management Front-end developer

  • Experience with modern JS frameworks (ReactJS is a plus)
  • In depth experience with web technologies and web based software (HTML5, CSS3 and JavaScript
  • You will be trusted to bring innovative ideas and solutions to our clients and help them achieve their value creation goals.
  • If you recognise yourself come join Railnova’s passionate team and help us conquer tens of thousands of trains to change the future of Railway.
  • We design our own hardware and software to connect to train fleets and monitor all business critical parameters.

At Railnova we are changing the way train fleets are managed. As a Front-end developer you will build and maintain the Railnova software platform.
Continue reading “Rail fleet management Front-end developer”