001 FAST NOTES

Easy and fast note-taking app.

A fun little app I made to practice some more with the Redux Toolkit.

The app allows users to register and log in and view a dashboard with a simple input and a button.

The app allows the user to add/remove simple and quick notes and displays them accordingly.

Also developing this app was a good practice for some back-end too as I had to build my own routes, controllers and models.

Features used, learned and made progress on, during this project:

  • React.js with Functional Components & Hooks
  • Redux Toolkit
  • React Router
  • Node.js
  • Express
  • MongoDB
  • JWT

002 KITESURFING MAP

Interactive map displaying locations based on fetched data.

This is actually a website developed for an interview on a junior front-end developer role.

The app had to allow users to log in (works with any username/password for testing purposes) and view an interactive map with pinned locations good for kitesurfing.

The app allows the user to add/remove the locations from favourites and also to filter the displaying spots on the map.

Also on the second part of the front page, the user can find a list of all the locations available that can be filtered with more details such as the coordinates, country, wind speed and also the best period to visit the location and have some fun.

Features used, learnned and made progress on, during this project:

  • React.js with Functional Components & Hooks
  • React Router
  • React Context API for managing some state and using it in Components
  • Axios library for data fetching
  • CSS Modules

003 THE SHOP

A fully functional eCommerce shop.

A MERN eCommerce shop following Brad Traversy's course with most of the features an online shop should have and relies on for a good shopping experience.

Following this course I developed a fully functional online shopping platform which includes:

  • User authentication and token authorization
  • Password encryption
  • User profile and order history
  • Individual order details
  • Admin management for:
    • products (create/delete/edit)
    • orders (track/mark as shipped)
    • customers (delete user account or edit e-mail & username)
  • PayPal and credit/debit payment methods (open to scale with other methods)
  • Product review and rating system
  • Product pagination
  • Product search feature

Features used, learned and made progress on, during this project:

  • React.js with Functional Components & Hooks
  • Redux.js by managing global state and using it in Components
  • Node.js
  • MongoDB and Mongoose ODM
  • Express
  • React-Bootstrap UI library
  • JWT authentication (JSON web tokens)
  • Environment variables

004 BURGER BUILDER

Food ordering app with costumizable options for ingredients.

This is a React app following Maximilian Schwarzmüller React 16 Course on Udemy that lets you custom your own burger and then proceed on ordering it.

Starting from setting up the project to deploying it, the app uses all the features of the React framework and it was an excellent way to learn about this awesome framework as a first stepping stone into the React library.

Features used, learnned and made progress on, during this project:

  • React.js with Functional Components & Hooks
  • Redux.js by managing global state and using it in Components
  • Firebase Authentication
  • Firebase Database
  • React Router
  • CSS Modules

005 VANILLA JS MINI-PROJECTS

A collection of small and fun JavaScript apps.

This was a fun and practical course to follow from Brad Traversy. The projects in this course were designed to help you with the use of HTML5, CSS & JavaScript with no frameworks or libraries. Every project was built from scratch and has some kind of dynamic functionality.

Features used, learned and made progress on, during this project:

  • Create layouts & UI's with HTML/CSS (no CSS frameworks)
  • JavaScript Fundamentals
  • DOM Selection & Manipulation
  • JavaScript Events (forms, buttons, scrolling, etc.)
  • Fetch API & JSON
  • HTML5 Canvas
  • The Audio & Video API
  • Drag & Drop
  • Working with Local Storage
  • High Order Array Methods - forEach, map, filter, reduce, sort
  • setTimeout, setInterval
  • Arrow Functions

Back to Top