Technology
The frontend of the website is a React.js Single Page Application bootstrapped from Create React App.
The primary source of data for the application is sourced from WordPress through the REST API.
Primary technologies used#
| Tool | Purpose |
|---|---|
| React | Front-end library |
| Redux | React global state-management |
| Webpack | JavaScript bundler |
| Create React App | Bootstrapping React application base, autoprefixing CSS, minification |
| Typescript | JavaScript types |
| React router | React route-based navigation |
| React helmet | React head/meta tag management |
| Formik | React form state management |
| Moment.js | JS datetime manipulation and display |
| Yup | Form validation |
| Axios | Fetch requests |
| Sass | CSS post-processor |
| Normalize.css | CSS reset |
The Create React App Webpack configuration will run CSS autoprefixing and minification, among other handy tools. Read the documentation for more info
TypeScript#
TypeScript is partially implemented across the application. This was recently introduced to enforce stricter data supply standards to React components. Ideally any existing code would be converted to TypeScript, however this could take some time. The TypeScript files have been changed to the .tsx or .ts extension whereas standard JavaScript/React files will have .jsx or .js. Both implementations will compile, so the current hybrid approach is working.
For more information on TypeScript visit the documentation.