Skip to content
Espen Henriksen edited this page Aug 29, 2017 · 1 revision

Architecture overview

At it's heart, RESTED is a web app inside a WebExtension wrapper. The only reason it needs to be a WebExtension is to work around the same origin policy that is build into the web platform. This means that if you are familiar with web programming, then there is very little custom extension API code to understand.

Because RESTED is essentially a fancy web app, it uses modern web libraries, which provides it many of its strengths. The app is based rather heavily around React and Redux, so familiarity with these are reccommended.

You can think of it as split into two - the left panel and the right panel. For a top-level overview of how the app is rendered, see the App component. In this component you see the clear separation between LeftPanel and the right side, which is made up of the two components Request and Response. A few words on these:

  • LeftPanel handles the collections and history, as well as the switching between the two.
  • Request is the outgoing request form, including the titlebar wich amongst other things can summon the options modal
  • Response handles rendering the response that has been recieved from the server

Redux

As mentioned, the app is rather heavily based on Redux. This means you should at least be familiar with the basic concepts of how it works if you are to understand the app.

For asynchronous actions, redux-saga is used. This is mainly to make asynchronous actions as testable as possible. You can think of redux-saga as async/await on steroids.

Forms are connected to redux using reduxForm. This enables us to access and manipulate the form from anywhere in the app with ease, as well as have a consistent lifecycle for validation and formatting.

Clone this wiki locally