A simple website that allows new and returning students to learn about the ACM club and keep them updated on upcoming events. Implemented using React for frontend and Sanity.io for headless content management system that allows current board members to edit/add events and member information without touching code.

UC Santa Cruz: Association for Computing Machinery (ACM) Club Website

This website contains all my solutions to the popular coding challenge website 

. The goal of these challenges is to reproduce the given design of a website as accurately as possible. It helped me shape who I am as a web developer today because I started using this website soon after I picked up web development! I learned how to apply concepts into practice and play around with different approaches. I documented my journey in the GitHub README's in each of my challenges. You can find the link to my Frontend Mentor profile after Contact section.

Frontend Mentor Challenges

This website was made purely with HTML/CSS and some JavaScript for the go to top button in mobile view. It was created based on her requested design and a theme of minimalism. We went through many iterations and she gave me constant feedback and updates on features/pages that she wants. I followed my client's instructions very carefully, from the fonts she chose to the exact margins and placements of the texts and buttons. On top of that, I made the website responsive so it is user friendly on all screensizes and platforms.

Christine's Portfolio

This react project utilizes the basics of react like useEffect, useState, useRef while building out a music player app. It allows users to select any song from the library and play the song, skip forward/backward to another song, play/pause, autoplay, and more! I learned many things like how to structure a react codebase, how components work, how to pass props, and more. Big thanks to 

MusiCloud

A full stack website that allows users to log and keep track of their time. I used React for the frontend and Express middleware web framework to handle CRUD operations and connect with MongoDB database. I used Firebase for the user authentication processes. I wanted to learn both Firebase and MongoDB so I implemented both. This is my first full stack website so I learned a lot about the backend side of things and how everything connects together through different API calls. The backend is hosted on Heroku and the frontend is hosted on Netlify. Since the backend is hosted on Heroku, loading the data might be a bit slow since I have a basic tier account.

Super Time Logger

I made a website for my first ever client on Fiverr. It was a very basic static website with multiple pages for their Rust gaming Discord server. 

Rusticord

, and I expanded upon his simple project. I added many more functionalities such as a search bar, hover over cards effect, splitting up generations, loading screen/animation, and much more. I used the Pokedex API to fetch data from their server and display it here. It was a challenge to incorporate search functionality and displaying pokemons because the response from their server is sometimes slow, so I added loading in chunks and loading animation to make up for the possible slow-downs.

Portfolio

UC Santa Cruz: Association for Computing Machinery (ACM) Club Website

UC Santa Cruz: Association for Computing Machinery (ACM) Club Website

Frontend Mentor Challenges

Frontend Mentor Challenges

Christine's Portfolio

Christine's Portfolio

MusiCloud

MusiCloud

Super Time Logger

Super Time Logger

Rusticord

Rusticord

Pokemon Pokedex

Pokemon Pokedex