Martyn

---

Stirk

React / Redux / React-Router / Node / Express / Mongoose / MongoDB Atlas / CSS / Codepen / Heroku / Git

My most recent project, a full-stack eCommerce React app interacting with a MongoDB API through async Redux axios calls.

The front end design is built from scratch using a theme developed through Codepen prototyping using CSS root variables and style resets to ensure consistency. The site uses reusable components and responsive component rendering, with React-Router for navigation. Redux manages state through the app for data such as API calls, wishlist and cart management, storing locally. The back end runs from MongoDB Atlas via Heroku, and uses multiple API end points and model cross-referencing to give consistent and easily modifiable data.

Created while learning React, this site grows as I learn more, with a current work to do list in the repo readme.

As a Strange Industries site, the client is a fictional company with questionable practices. In this instance, Strange Flora is an eCommerce site selling various plants and potions not recommended for human consumption.

React / Redux / React-Router / MongoDB Atlas / Mongoose / Express / Node / Bootstrap 4 / Heroku / Git

A MERN stack Twitter clone app with landing, authorisation, users and messages, with Redux handling API calls to a Mongo/Express/Node backend.

The front end is built off Bootstrap, customised to give a synthwave style aesthetic.

The back end is an API running off Heroku and MongoDB Atlas and interacts with the frontend via asyncronous axios calls through Redux actions. Authorisation uses JSON web tokens and local storage.

Built initially as a basic site through Udemy's Advanced Developer Bootcamp, I have already made significant aesthetic changes and plan to keep expanding backend funcitonality based on Twitter's model.

Bootstrap 4 / GSAP / Mongoose / MongoDB Atlas / Express / Node / Passport / Heroku / Git

An extensive full stack real estate website with listings, users, admins and comments databases.

The front end is built on Bootstrap in EJS, with colour palette and styling changes. The landing page contains interactive JavaScript GSAP animation, and features are shown/hidden as appropriate for different levels of user.

The back end is built on Node.js, using packages such as Express for routing, Passport for user authentication, Mongoose for Mongo integration, Body Parser for passing parameters and Dotenv for hidden variables.

The site contains fully RESTful routing for listings and comments, and partial routing on users and admins.

As a Strange Industries site, the client is a fictional company with questionable practices. In this instance, Strange Estates is a shady lettings agency with user interactions for listing reviews and administration roles.

GSAP / SASS / API interaction / Anime.js / CSS Animation / JavaScript Animation

I use Codepen extensively for small projects and development of site components. The ease of integration with libraries & preprocessors make it an ideal playground for me to try new ideas and take part in weekly challenges.

Most pens are front end orientated pieces and animations. These frequently use JavaScript libraries such as GSAP, Anime.js, & jQuery, and preprocessors SASS and PUG.

My portfolio there also contains online course excercises and FCC projects, along with API projects using AJAX, JSON & AXIOS requests

GSAP / Extensive CSS / JavaScript / Intersection Observer / HTML / Git

My personal site, Strange Industries, is built entirely from scratch. It uses minimal plugins, as I was aiming to build as much as I could myself.

The hero section makes extensive use of the GSAP JavaScript library to run complex CSS and SVG animation. The header title animation is randomly generated, so every page load gives a different sequence of letter animations. Other sections use GSAP and CSS animations, combined with Intersection Observer to play or stop animations on scroll.