About Me

Hello, I'm Joan Marie Verba. I'm a web developer and UX/UI designer. I believe that the goal of web design and web development is to make applications/web pages that present users with the information they want in the style they prefer. I find this both challenging and exciting, and is one of the reasons I find design and coding so much fun.
Joan Marie Verba photo

Education

Graduate of the Iron Yard Minneapolis
Iron Yard logo

The Iron Yard offers immersive, 12-week courses that go far beyond tactical skills and teach students to think as a software engineer. The process shows students to learn how to learn so as to keep current on technologies in the long run. The Front End Engineering course focuses on creating experiences in web browsers that users see and interact with. The lessons cover subjects from web design principles to complex JavaScript applications (including ReactJS) that manage data, in addition to HTML and CSS.

Graduate of the Google UX Design Certificate course on Coursera
Google UX Certificate

Those who earn the Google UX Design Certificate have completed seven courses, developed by Google, that include hands-on, practice-based assessments and are designed to prepare them for introductory-level roles in UX design. They can complete the design process from beginning to end: empathizing with users, defining their pain points, coming up with ideas for design solutions, creating wireframes and prototypes, and testing designs to get feedback.

Graduate of the University of Minnesota Coding Boot Camp
UM Coding bootcamp logo

Full Stack Web Development: Intensive 24-week course dedicated to designing and building web applications. Skills covered consisted of HTML5, CSS, JavaScript, jQuery, Bootstrap, Media Queries, Firebase, Handlebars, Node.js, MySQL, MongoDB, Express, ReactJS, REST, and MVC paradigm.

Skills covered

HTML5

CSS: Includes Bootstrap, SASS, Media Queries

JavaScript libraries: jQuery

JavaScript testing and compatibility: Testing projects work across devices and through updates.

Backend basics: Deploy apps to local and live environments.

Tools: Node.js, NPM, Horizon, Express

JavaScript foundations: Types, functions, objects, scope, closures, constructors, prototypes and much more. Built applications with JavaScript.

Version control: Git, GitHub

Architectual Styles: REST, MVC

Additional Skills: PHP, WordPress, Adobe Creative Suite (InDesign and Photoshop), Microsoft Word, Excel, PowerPoint

UX/UI Design: Adobe XD, Figma, Sketch

Previous work experience

Real-time, online programming in FORTRAN and BAL for airline applications.

My UX design projects

Sites I have designed and coded

Directory screen capture

Directory Database

Constructs a directory for an organization. Individuals manage their own information, and an administrator manages the input ids and records. Written in React.

Code Demo

Movie Search screen capture

Movie Search

This features an API call to the OMDB database. Users can search by the title to a movie. Output is a movie poster, the title of the movie, the year of the movie, the actors in the movie, a plot summary, and the movie's rating. Uses JavaScript, jQuery.

Code Demo

Astronomy Picture of the Day screen capture

Astronomy Picture of the Day

This features a call to NASA's API. Display the Astronomy Picture of the Day. Uses Javascript, jQuery.

Code Demo

Book chat screen capture

Book Chat

This shows a chat application for book readers.

Code No Demo

Current Weather Screen Capture

Current Weather

This features a call to the Open Weather API, to display the current weather for a city. Users enter a zip code or city name. Uses JavaScript.

Code Demo

Weather Forecast Screen Capture

Weather Forecast

This generates a 7-day weather forecast for a city. Features a call to the Open Weather API. Users enter a zip code or city name. Uses JavaScript.

Code No Demo

crystals game screen capture

Crystals Collector game

This is a single-player addition game using crystal images. Rules are on the page. Uses JavaScript, jQuery.

Code Demo

Robot Combat Game Screen Capture

Robot Combat Game

This is a single-player game with fighting robots. Rules are on the page. Uses JavaScript, jQuery.

Code Demo

Marvel Character Search Screen Capture

Marvel Character Readout

This features a call to the Marvel comics API. Enter the name of a Marvel character and get a picture and description.

Code No Demo

Guess a word screen capture

Guess A Word

A word is selected. The user has 12 tries to guess the word. Letters already guessed are displayed. Uses JavaScript, jQuery.

Code Demo

Trivia game screen capture

Trivia Game

When user presses the start button, eight questions appear. User has 30 seconds to answer them. Uses JavaScript, jQuery.

Code Demo

gifs screen capture

GIF display

Displays outer space gifs. Uses JavaScript, jQuery.

Code Demo

Guess a number screen capture

Guess A Number

A simple interactive game. The computer selects a random number from 1 to 100 (inclusive). The user has 10 tries to guess it. JavaScript exercise.

Code Demo

Portfolio screen capture

This portfolio page

The code for this portfolio page. Uses Bootstrap.

Code Demo

train schedule screen capture

Train Schedule

A Firebase exercise. Displays the current time and the time to the next train.

Code No Demo

friend finder screen capture

Friend Finder

An Express Exercise. The user answers survey questions and is given the closest match in the database.

Code No Demo

burgers screen capture

Eat the Burger!

MySQL and Handlebars exercise. Enter a burger name and it appears on the left with a devour button. Click the devour button and the burger name displays on the right.

Code No Demo

New York Times search screen capture

New York Times search

This features a call to the New York Times API. Article URLs can be saved or deleted, Uses Mongoose, React, Node, Express.

Code No Demo

news scraper screen capture

View the news

The purpose of this assignment is to use cheerio to find article titles and links from the web and display them. These article titles and links are saved to a mongo database using mongoose. One can see the retrieved articles, save certain articles, and add notes to saved articles.

Code No Demo

memory game screen capture

Memory Game

This game is built with ReactJS. The display shows several images. If you click on an image, you get a point. If you click on the same image more than once, you lose, and the game resets.

Code No Demo

one side of the page scrolling image

Online Resume: One Side Scrolls

This format has a fixed left side/menu and a right side that scrolls.

Code Demo

Copyright © 2024 Joan Marie Verba