Code Repository for personal portfolio website

Julia Czarnecki | Design | Code | Digital

Code repository for my design portfolio website, becausejulia.com. Project files are uploaded here for your code review and Netlify web hosting. I selected the Bootstrap framework for its ease of use and component library, although it notoriously delivers some code bloat. To combat that, I went with 11ty for a static site generator, known for its performance and low barrier to entry. In the future, I'd like to continue optimizing my use of both systems to deliver a more performant site.

Table of contents

• Project Dependencies
  • Design Resources
  • Code Resources
  • Tech and Tooling
  • Links
• Project Roadmap
  • Current Screenshot
  • Future Improvements
• Acknowledgments

Project Dependencies

Design Resources

• Google fonts: Playfair Display && Montserrat
• Bootstrap icons
• Mockup Imagery: freepic.com

Code Resources

• Hover.css
• Dribbble API

Tech and Tooling

• HTML, CSS (SCSS), JS, Njk
• 11ty

Links

• Live Site: https://www.becausejulia.com/
• Hosting via Netlify:

Project Roadmap

Current Screenshot

Future improvements

• GitHub Project: BecauseJulia Updates and Fixes

Acknowledgments

• Hat-tip to Brewhouse Digital for their write-up on Using PurgeCSS with Bootstrap and Eleventy which I leveraged (with some modifications) in compileCSSFramework.js
• 'Showcase' images at the bottom of the /design/ pages are shuffled using Chris Coyier's Shuffle Array code.
• 11ty Navigation and Sass set up via Stephanie Eckles' 11ty Rocks!.
• 11ty setup tutorial from Kevin Powell's YouTube.
• Write-up on XSS security with Netlify Hosting How to Secure Your Netlify Site With a Content Security Policy (CSP)
• Cool animated SVG hamburger icon from Basic, Intermediate & Pro animated hamburger icons by Kevin Powell.
• Getting started with Variable fonts on the web by Kevin Powell.
• Pointers for Creating an 11ty collection from a JSON API
• AI Robots Block list from ai-robots-txt

Becausejulia.com designed and coded by Julia Czarnecki leveraging dependencies above. All logos, fonts, and imagery used remain property of their respective copyright owners.