ERIK MATTHEIS

Full stack developer

Approach

Turning a challenge into something beautiful and functional excites me.

In the 90s, a web developer handled everything except running the server. If we could manage shared hosting, we were deemed webmasters.

Now still, a full-stack developer oversees all aspects except server management. I've acquired proficiency in DevOps, making me a contemporary Web Master.

My journey has seen me play diverse roles, including that of a Scrum Master. However, my true passion lies in contributing to a small, dynamic team that transforms ideas into live productions.

While my coding pace is deliberate, I excel in swift troubleshooting and consistently deliver solid results that prove highly effective.

Explore this portfolio showcasing recent solo projects. As we approach Spring 2024, I am actively seeking opportunities to join a team or serve a new client.

Tools

Let's leverage the power of Artificial Intelligence and employ cutting-edge technologies and tools to enhance and simplify projects. In these projects I use:

  • Frontend
    • ES2021
    • Vue
    • BootstrapJS, BootstrapVue
    • HTML5, CSS3
    • Liquid
    • jQuery
    • AngularJS
  • Backend
    • Node
    • NoSQL
    • Nuxt
    • SQL
    • PHP/MySQL/Apache
    • Wordpress
  • APIs
    • Firebase
    • Atlas
    • OpenAI API
    • Google Identity Services
    • Google Ads API
    • YouTube API
    • Google Maps API
    • Google Analytics API
    • Google Books API
    • Google Calendar API
    • Google Drive API
    • Google Sheets API
    • Facebook
    • MailChimp
    • Print-on-demand
    • REST
    • Shopify Admin API
    • Winston
    • Passport
    • Twitter API (X API v2)
  • AI
    • OpenAI GPT
    • OpenAI Dall-e
    • Google Bard API
    • Tesseract
  • DevOps
    • Heroku
    • Netlify
    • Google Cloud
    • AWS
  • Software
    • Photoshop/Illustrator
    • VS Code
    • Git
    • Terminal
    • Compass
    • Postman
    • Chrome Dev Tools

Work

Articl.net

Articl.net

Website

Frontend Backend

A repository of radiological research and educational materials with a custom CMS and document scraper.Originally a WordPress blog, I took on the project to transform it into an AngularJS application leveraging the WordPress REST API. In winter and spring 2024, we are incorporating additional features and transitioned it to Vue, supported by a custom API implemented in Node/Express/MongoDB. You can find the respective repositories for the frontend / backend , and foraccess to the development site link, please contact me via email .

Naturally Hued

Naturally Hued

Website

Github

As part of a self-directed initiative, I undertook a project aimed at refining my AI and design proficiencies. The text and image content is created by GPT3.5 and Dall-e 2. Administrators can directly edit the content and direct the AI in making revisions.

GreatClips AdTool

Google Ads API automation

Github

Automates and oversees Google Ads campaigns for GreatClips franchise owners in a simple interface. Instead of navigating through hundreds of fields in the Google Ads Dashboard, franchise owners are presented with the eight fields they need to create customized, effective, location-based ads.

Key Features

  • Dynamic Ad Generation:
  • Budget Management
  • Ad content customization
  • Keyword Targeting, Demographic Targeting, Proximity Targeting
  • Error Handling address potential issues with data

Technologies and Tools

  • Express.js
  • Node.js:
  • Google Ads API
  • xml2js

Articl Q&A

Medical Study Tool

Developed by two UMN-Duluth CS majors under my mentorship during a summer semester, the focus was on highlighting distinctions between writing production-ready code efficiently and showcasing competence in an academic setting.

Github

Key Features

  • Creates and deliders multiple-choice quizzes.
  • Registrs and authenticates user accounts.
  • Category Organization: Allows the categorization of quizzes based on medical topics for easy navigation.
  • User Profile including progress and contributions.
  • Responsive Design: Optimal user experiences for web and mobile.

Technologies and Tools

  • Vue.js
  • Bootstrap
  • Node.js
  • Express
  • MongoDB
  • Mongoose
  • Passport
  • Nodemailer
  • Bcrypt

SlotMachine

Video One-armed Bandite

Slotmachine is a one-arm bandit game developed to show off and explore the differences between Vue 2 and Vue 3. The slot machine incorporates symbols inspired by iconic figures like Prince, David Bowie, Lady Gaga, and is festooned with birds and food. What else could you want?

Key Features

  • Theatrical symbols including Prince, David Bowie, Lady Gaga, birds, and Oreo cookies.
  • Implements a credit system allowing users to spin the slot machine with a starting credit balance that is partially replenished each day.
  • Reel physics enhance the slot machine experience.
  • Incorporates sound effects and jingles I created in Logic Pro.

Technologies and Tools

  • Vue.js
  • Vuex
  • Vue CLI
  • Babel
  • ESLint
  • Audio Files: Various audio files for sound effects during gameplay.

Mongodb_s3_backup

Custom DevOps Tool

Github

This tool addresses a specific need I encountered while migrating a MongoDB database to AWS Cloud. I couldnt find anything to do exactly what I wanted so I made my own.

Key Features

  • MongoDB Backup: Enables seamless backup of MongoDB databases to ensure data integrity during migration.
  • Amazon S3 Integration: Utilizes Amazon S3 for secure and scalable storage of MongoDB backup files.

Technologies and Tools

  • Node.js
  • Express
  • MongoDB
  • AWS
  • Amazon S3

    OpeningRangeBot

    Options Trading Bot

    Github"

    The project was developed to learn Node.js. It can perform automated options trading based on a few simple strategoes. It TradeKing and simulation data from files to simulate trades without actual market involvement.

    Key Features

    • Automated Trading: Executes trading strategies for options based on market conditions.
    • Simulation Mode: Supports simulation of trades without actual market involvement.
    • Dynamic Configuration: Configurable parameters for risk factors, opening minutes, and strategy requirements.
    • Cron Job Scheduling: Utilizes Cron jobs to initiate and stop trading at specified times.
    • Data Streaming: Integrates real-time data streaming from TradeKing and simulation data from files.
    • MongoDB Integration: Stores trading data in MongoDB for analysis and tracking.
    • Web Interface: Includes a web interface for user interaction and data visualization.
    • Authentication: Implements OAuth for secure API access.

    Technologies and tools

    • TradeKing API
    • Node.js
    • Express
    • MongoDB
    • OAuth
    • Bootstrap
    • AngularJS
    • Highstocks
    • Mocha and Chai

GSNBasic

WordPress Theme

The gsnbasic project crafted a sleek, responsive WordPress starter theme for retailers, seamlessly integrating GSN's electronic coupons. It featured Bootstrap 3, a full-screen slider, social icons, and customization options for layout, colors, and fonts. The theme prioritized SEO with clean code, and notably, it was translation and multilingual ready

Key Features

  • SEO Friendly
  • Customization options for layout, colors, fonts, and slider settings.
  • Internationalized & Localization
  • Threaded Comment

Technologies and Tools

  • WordPress
  • Bootstrap
  • FontAwesome

GSN core

Team AngularJS Project

Github

I worked on a team of three for a digital coupon generation project for GSN (Grocery Shopping Network), which is now defunct. We wrote soft and maintained softwagrocery chin in the Midwest used to create electronic version of weekly coupons. The project involved creating a platform for users to shop for groceries with meal planning solutions, save money using printable coupons, and access recipes and meal ideas.

Key Features

  • Weekly Specials: Users could explore weekly specials on groceries.
  • Recipes: The platform provided a collection of recipes for users to discover.
  • Coupons: Digital coupons were generated to help users save money.
  • Meal Planning: The system included meal planning solutions.
  • Cooking Videos: Users could access cooking videos for guidance.
  • Low Prices: The platform aimed to offer competitive and affordable prices.
  • Online Shopping: Users had the option to shop for groceries online.

Technologies and Tools Used

  • Server-Side Scripting: PHP
  • Server-Side Framework: Laravel (4.2)
  • Database: MySQL
  • Front-End Framework: AngularJS
  • CSS Framework: Twitter Bootstrap (3.1.1)
  • Coupon Integration: Coupons, Inc. for digital coupon functionality
  • JavaScript Libraries: jQuery, Handlebars.js, qtip2, blueimp Gallery
  • Icons: Font Awesome (4.3.0)
  • Other Tools: Angular Facebook, Angular Recaptcha, Bootstrap Image Gallery
  • Mapping: Google Maps API
  • Analytics: Google Analytics, Twitter Widgets
  • Build Tools: Grunt (not explicitly mentioned but commonly used with AngularJS projects)

The project aimed to enhance the grocery shopping experience by combining digital coupons, meal planning, and online shopping features within a user-friendly web application.

GSN API Client

WordPress Plugin

Github

The GSN API Client project aimed to facilitate grocery store chains in integrating digital coupons into their marketing websites. Developed for Grocery Store Network, a vendor providing digital coupons to various Midwest chains.

Key Features

  • GSN API Integration: Utilized GSN's RESTful API for seamless integration of digital coupons into marketing websites.
  • Client Credentials Authentication: Enabled authentication with GSN RESTful endpoints using client credentials.
  • Dynamic API Calls: Allowed dynamic API calls to GSN endpoints, such as fetching a list of stores.
  • Token Management: Managed access and refresh tokens for secure and authenticated interactions.
  • Efficient Caching: Implemented transient caching to enhance performance by storing API responses temporarily.

Tools and Technologies

  • WordPress
  • PHP
  • cURL

Cryptocurrency Dashboard

Financial Arbitrage Tool

I made this to learn PHP, which I know but avoid using. This tool compares prices between the Cryptsy and Bter cryptocurrency exchanges. The dynamic graph highlights bid and ask prices, aiding in identifying arbitrage opportunities.

Key Features

  • Intuitive Visualization
  • Error Resilience

Tools and Technologies

  • PHP
  • cURL
  • MySQL
  • Highcharts