// Hello World

if (energized) {

keepCoding();

} else if (curious) {

scrollDown();

} else {

sleep();

});

Andreas Campan portrait

Hi, I'm Andreas.

Welcome to my world of code! I'm a Full Stack Developer with a passion for building cutting-edge web applications. From design to deployment, I love turning ideas into reality with clean and efficient code. Whether you need a backend guru or a frontend wizard, I have the skills and expertise to bring your vision to life!

Projects

Screenshot image of the scoreknight web app

Score Knight

Driven by my wife's frustration with using the Notes app to keep track of scores during game nights, I created a progressive web app that simplifies scorekeeping and can be used offline as well.

Tech Used: React

Score Knight Github
Screenshot image of the TechScraper excel export

TechScraper

CLI script which, upon execution, extracts information on products from the internet and generates an Excel spreadsheet. Additional details can be found in the README file located on my GitHub page.

Tech Used: Node.js, Puppeteer

Github
Screenshot image of the filmquarry website

Film Quarry

This web application provides users with information about movies, directors, and genres. Users are able to sign up for free, update their personal information, and create a list of their favorite movies!

Tech Used: React, Express.js, Node.js, MongoDB

Github
Screenshot image of the citymeet website

City-Meetup

This events web application lets you login using your google account to view CF's latest web development events. For more information check out the website below!

Tech Used: React, Google Calendar API, AWS

City-Meetup Github
Screenshot image of the pokedex website

Pokédex

This project creates a pokédex which loads pokémon data from an externalAPI. See links below for more detail.

Tech Used: HTML, CSS, Bootstrap, JavaScript

Pokédex Github

FQ Case Study

Screenshot image of filmquarry's user-details page

Problem

As a full stack web developer, I needed to have experience coding both the client-side and server-side of a website.

Purpose

Film-Quarry was a project I created for the purpose of learning how to build the client-side and server-side of an application from scratch using the MERN stack.

Objective

The goal of the project was to design and create an application that allows users to sign up using their email and sign in granting them access to information about different movies, directors, and genres. Users would also be able to create a list of their favorite movies, update their personal information or delete their account.

Approach

Server Side

The server side is composed of two parts, the API hosted on Heroku, and the server hosted on MongoDB Atlas. The RESTful API was created using Express.js and Node.js.

The API interacts with a non-relational database called MongoDB via URL endpoints that utilize HTTP methods (GET, POST) through a JavaScript library called axios. The database uses the CRUD methods to retrieve, store, or manipulate data and was tested throughout development using Postman.

Users are authenticated on the server side via HTTP and JWT (JSON Web Token) authentication, while CORS policy is enabled to ensure a higher degree of security.

Screenshot image of the postman application usage
Screenshot image of the filmquarry website

Client Side

The client side was developed with React as a SPA (single page application) that is responsive across all devices. React-Redux is used for state management. The React code follows the standard developing framework of creating the website using multiple components.

The website provides an interface for users to sign up and log in to retrieve data about movies, genres and directors. Users can add their favourite movies to a favourites list as well as access and change their profile information.

Conclusion

Challenges

Going into this project I knew I would face some difficulties. Initially I found the concepts of server data security and user authentication perplexing. After spending time with my mentor and tutor, as well as online research, I was able to grasp the techniques and technologies that were used behind the scenes such as CORS policy and JWT.

Hindsight

It's true when they say that hindsight is 20/20; and looking back I wouldn't change a thing. Through my difficulties I have developed my skills as a full stack web developer. I learned and solidified my knowledge of user authentication, server security, react-based websites, and plenty of other topics. There is however always more to learn!

Technical Skills

Basic
Intermediate
Expert
javascript logo
Javascript
nodejs logo
Node.js
mongodb logo
MongoDB
html logo
HTML
css logo
CSS
SQL logo
SQL
postgreSQL logo
Typescript
Angular logo
Angular
react logo
React
postgreSQL logo
postgreSQL
C++ logo
C++
postgreSQL logo
Python

About Myself

With a background in oil industry operations, I have cultivated a unique set of skills for collaborative problem-solving and attention to detail. My passion for technology has driven me to pursue various projects in web development, computer systems, and IT services, which have allowed me to develop a keen eye for user-oriented designs and solutions. My goal is to combine my technical expertise with my prior work experience to develop and maintain valuable products and services that meet customers' needs.

Download Resume