/brandi

Brandi Cameron's portfolio website.

Primary LanguageJavaScript

Brandi Cameron's Portfolio Site

Next.js site using css modules with a mix of css and framer motion animations.
VIEW LIVE: https://brandicameron.com

App Screenshot


Always something new to learn:

  • First time requiring multiple api fetches, therefore first time using Promise.all.
  • Learned about using aria-live='polite' to prompt screen readers to announce different aria-labels when a toggle button is clicked. (used in about section)
  • It was fun figuring out how to code the css rain/snow, randomizing the drops placement and animation delays using a random number function in inline css.
  • First time creating a dark mode theme — created using css variables. (dark mode kicks in after dusk in Nashville on the index/weather banner section to indicate nighttime.)
  • Dug into Framer Motion a bit more, still a lot to learn there.
  • Learned how to add and delete items from an array in firestore database.
  • Thanks to a very helpful Reddit user, was alerted to a security hole with Firebase (ability for people to sign up for an account even if there is no sign up form in the UI by issuing an HTTP POST request to the Auth endpoint) - learned how to tighten up my database security rules to only allow a particular user to write data.

Credits & Attributions


Graphics were customized in Illustrator using vector graphics from the following:

Cloud Graphics: rawpixel.com from freepik.com

Lightning Graphic: Creative Stall from NounProject.com

Moon Graphic: Pundimon from NounProject.com

Koala Graphic: Loritas Medina from NounProject.com

Resume Graphic: Reza Nur from NounProject.com


Contact Info

Brandi Cameron

hello@brandicameron.com

www.brandicameron.com