Marisa Brantley's Projects
This is a single-page responsive website project for Codecademy Pro's "Learn Responsive Design" class. I enjoy cycling and was inspired by a local cycling Meetup group.
Skillcrush Class Project re Personalizing Flexbox Project, Centering
This Skillcrush "Milestone Project" entailed designing, building and launching a portfolio website (non-responsive). I chose calming blues and greens, inspired by the relaxed beach life of our area.
The Piano Game Project is an interactive game created with DOM events in JavaScript for a fictitious music education company to help their beginner-level piano students study.
✨ My portfolio website - clean, responsive & accessible.
The Potluck Invite Exercise had students use querySelectors, event listeners, event handlers to change a headline, and the classList property & an if/else statement to create dark mode.
This Progress Steps Project uses HTML, CSS, and JavaScript to make numbered circles and a line going through each change color after the "next" and "prev" buttons are clicked.
In Codecademy's Race Day Project, we wrote a program in JavaScript that registers runners for a race, as well as providing instructions on the big race day.
This Random Color Generator uses DOM event handlers for users to select colors by clicking and scrolling on buttons.
This project involves pulling random user images and corresponding data from the Random User Generator API, and creating a drop-down menu to select the number of users to display.
Skillcrush Coding Responsive Websites Class Assignment with Flexbox
Skillcrush Media Queries Background Project
Making a Former Static Website Responsive (Mobile, Tablet, Desktop) for a Skillcrush Class Project
For this Codecademy functions project, we use JavaScript control flow (conditionals), switch statements, and if/else statements to create a program for this classic, 2-player game.
The Rogue Pickings website is a mock client site for the final project in Skillcrush's "HTML and CSS" class. It is based on a Photoshop PSD comp, and utilizes CSS Flexbox.
This project involves having the entire website rotate when the hamburger icon is clicked and bringing in the navigation on the bottom left. The page shown was recreated from my Etsy Shop, Sadie Bloom Designs.
JavaScript exercise on selecting and modifying the mock florist website, Ryan's Roses, with querySelector() and other properties as part of Skillcrush's JS, HTML, & CSS Lesson.
A static bar chart created for fictitious company Organic-Press displaying the top 10 produced foods in the world, using HTML and SCSS variables, functions, and loops.
This SASS project uses for-loops and color functions to dance through the color wheel.
The Sassy Parallax Banner project is a landing page with parallax images for a Myanmar travel website. The parallax uses SCSS nesting and mixins.
This JavaScript project contains a digital school catalog for the fictitious New York City Department of Education. It focuses on classes, properties, getters, setters, and methods.
Sections on a page transition in from alternating sides when scrolling down. The opposite happens when scrolling up the page.
Using JavaScript array methods, we transformed an array of strings into a secret message.
This project was created for a fictitious pet rescue, so visitors on their site could view which pets were available to meet and play with.
Do you get enough sleep? In this Codecademy JavaScript functions project, we created a program to determine if you're getting enough sleep each week, how much you should be getting, and how far you are from your goals.
This project involved using HTML5 audio tags to create a simple sound board. Each audio element is controlled by JavaScript.
This project shows split-screen background images, each with overlays. When hovering the mouse on one side of the split screen, it expands to 75% while the other side reduces to 25%.
Skillcrush Coding Responsive Websites Class Project
This interactive React app allows users to create sticky notes, as well as edit, search through, save and delete them.
A subscription calculator to provide the user with the cost of plans for different subscription types and durations.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent