< h 1 > W e l c o m e , s t a y a m o m e n t ! < / h 1 >
A head profile of James wearing a festive Christmas hat.

Thank you for visiting my website.

I'm a full-stack web developer recently graduated from the University of Miami's Division of Continuing & International Education Online Coding Bootcamp in June 2022. This website has evolved from being an early bootcamp assignment to a real labor of love for me where I can showcase my talent and knowledge about web development. I hope you enjoy your visit as much as I have enjoyed creating this site.

This website is built using HTML and CSS. Where I am not using raw CSS to style its content, I use Bootstrap, mostly for its Container layout element and Card component. You can see that in the work section. The fonts I use are pulled from Google Fonts, and the icons you see throughout are from the icon library Font Awesome (which I love as a resource for adding pizazz to a web page). Before you leave, spend a moment to review my work.

The infographic you see below shows all the places I have lived to date. It is a composite of a PNG image which was created with Canva, and a number of paths made with Adobe Illustrator and layered over the image. The animation is achieved with CSS and involved duplicating the paths, using attributes like stroke-dasharray and stroke-dashoffset, and a few precious hours of intense concentration to get it all right. I toiled with attempting to use one single animation call for the entirety of the paths but alas, some sleuthing led me to discover it's impossible, so 10 distinct animation calls it is!
My Work

The apps I have worked on span a number of technologies, libraries, and frameworks. The cards below represent a subset of that work. I invite you to visit my GitHub to see the full portfolio of work.

As I hope this website may demonstrate, I have a defendable grasp of HTML and CSS. My knowledge of JavaScript encompasses many of the features debuted in its 2015 revision (ES6), including keywords let and const, arrow functions, classes, promises, rest and spread operators, and methods for iterating over elements in an array, or iterable objects. As a result of the more than 100 hours of 1-on-1 personal tutoring I have provided to web development bootcamp students, I have managed to strengthen my core understanding of topics such as asynchronous JavaScript, promises, and the event loop.

Migrating towards the back-end of the stack, I have some foundational knowledge and experience with Node.js as a runtime environment for executing JavaScript outside of a browser environment. See my README.md file generator repo or team profile generator repo for some examples of my work with Node.js. I pair Node with Express.js, a minimalist web-server framework, which allows me to establish API routes, or endpoints, and handles the response when a client-side request (HTTP GET, POST, etc.) hits a particular endpoint. See my NoteTaker repo for a quick demo of using Express. In addition to these core skills, I have some experience working with SQL-based databases (MySQL), and fetching or updating records in a table from client-side HTTP requests (CRUD).


Movie Search Platform - IMBD

This application is a reflection of knowledge in HTML5, CSS3, JavaScript, & web-native APIs and third-party APIs, after six weeks into the coding bootcamp. It was a group project, and I was responsible for the "Staying in" portion. Some points to mention include using Bulma (as a CSS framework other than Bootstrap), using the Fetch API to query a server for data and then display the data to the page, mobile responsiveness for the site, and first time using GitHub in a collaborative environment.

Social Network API

This repo is an exercise in building an API tailored for a social network website where users can create, update, and delete thoughts, comment on other friend's thoughts, and add other users to their friends list. It uses Node.js/Express.js backend for handling HTTP requests (GET, POST, PUT, DELETE) to different endpoints; the NoSQL database MongoDB and ODM Mongoose are used to map MongoDB's document representation of data to a virtual object database. View the walk-through video for an overview of its functionality.

E-commerce backend

In this repository, I showcase using Sequelize, an object-relational mapper configured in a Node.js application, to allow me to perform CRUD (create-read-update-delete) operations on an SQL database without ever writing a line of SQL code. Sequelize is similar to Mongoose for NoSQL-based databases in that you can use Sequelize to create and define virtual models of objects and translate HTTP methods into changes on a database. I also use the bcrypt package to hash password information, and use environment variables for protecting sensitive data.

Employee CMS App

This application is a no-frills command-line application for managing a company's employee database. I built this simple demo with Node.js, Inquirer.js, and MySQL for the RDBMS. After the Node.js application connects to a SQL instance, the user is able to view departments, roles, or employees, make changes (i.e. add a role or employee), or make updates to existing records. A switch statement handles the possible scenarios the user may select.

Note taker Node.js app

This app demonstrates my first experience with the popular server framework Express.js for Node. Express allows me to quickly establish my routes for the different HTTP request methods. Whereas up until this app's development I only had exposure with client-side requests to a server, this app provided practice in how to handle user requests at distinct endpoints, or URLs. This app also accompanied my first introduction to Insomnia as a client utility for testing one's routes, as well as the deployment of the app to the cloud application platform Heroku which allows for deploying a server.js file that runs the Node.js process.

Team profile generator Node.js app

This app was a lot of fun to build and challenged me to integrate a lot of the material I had learned up to that point in my program. The app comprises a command-line application which uses Inquirer.js package to take in user input, and interpolates the information into HTML templates to build out the rendered webpage. The development involved implementing OOP principles like inheritance with modern ES6 class syntax, writing unit tests to assure code acted like intended, and taking user input and using template literals to dynamically generate an entire HTML page from the command line.

Professional README generator Node.js app

This app served me most practically during my time in the bootcamp. The third-party module Inquirer is used to prompt and store user input; that input is subsequently passed into a helper function which will return a markdown string that is saved to a file as README.md. In terms of saving time, I found this assignment to be very helpful, and I still use it today in situations where a markdown file is required.

Weather Dashboard

This webpage involved making HTTP requests to server-side APIs for data using the Fetch API, and then subsequently integrating the data into the webpage. User input is validated, passed into the fetch URL, and relevant weather data is retrieved. The weather data is parsed from JSON notation and converted into regular JavaScript objects. Properties of the object are accessed using dot notation and used to populate certain parts of the webpage. The site is fully mobile-responsive. Local Storage API is also used for storing and retrieving city names.

Work Day Scheduler

This app is a simple workday scheduler, built mostly for practice in introducing third-party APIs, libraries, and frameworks into development for adding functionality. The popular front-end CSS framework Bootstrap is used, as well as jQuery, and Moment.js. jQuery is very good at DOM manipulation/traversal. Moment.js is used for easy interaction with dates. A content delivery network (CDN) is used for supplying styling and fonts.

Screen capture of the workday schedule app
Code Quiz

This app showcases a timer-based coding quiz that stores high scores using client-side storage. It introduces browser web APIs for interfacing with JavaScript. Some features of the quiz are: listening for mouse click events from the user; using for loops to cycle through the quiz questions; creating a time limit for the game using time functions, executing conditional logic to determine right and wrong answers; and using GitHub pages to publish the static HTML file.

how to reach me
the resume

Please email me for a copy of my resume. Or reach out to me on GitHub.

miscellaneous

Want to leave me an audio message transcribed into text? Click here!

I've uploaded some photos of my travels over the years. Click here to have a look.

As time continues, I'll add things I find interesting or worth sharing. See you later and thanks for visiting!