Giter VIP home page Giter VIP logo

gatsby-portfolio's Introduction

๐Ÿ† itsmejeremyd.com - Gatsby Edition ๐Ÿ†

This is a port of my portfolio to Gatsby. Eventually it will replace the current static site, and the development experience will be more streamlined (with regards to future features and deployments).

My learning goals are as follows:

  1. Recreate my static HTML site in Gatsby

    This will give me some more experience using React, while letting me work with a static site generator, server-side rendering, and performance considerations, all while building a showcase for my future (and some past) work.

  2. Work with unit and integration testing

    I recently attended a workshop at HackerYou on testing React applications with Jest. While some of the content was beyond what we had covered in the bootcamp, it shined a light on where I was weak, and concepts that I needed to explore. Unit and integration testing will be a part of the experience, and some TDD as well.

  3. Refactor the design and css

    We only had a week to take a rough design and prep it for Industry Day. There are some usability issues, things that could be built out as components, and features that I just didn't have time to figure out.

gatsby-portfolio's People

Contributors

drydenje avatar

Watchers

James Cloos avatar  avatar

gatsby-portfolio's Issues

Initial page load doesn't display CSS

Link to know Gatsby issue

When the page is initially loaded, it won't display any stylings on the main page. If you click on a link in the navigation menu, they will load properly.

This is a known Gatsby issue, possibly related to the order in which I'm bringing in the stylings. Cleaning up the styled components needs to be done anyways, and changing where they are imported could help as well.

Header: Quote styling

How do I store a quote, then style/render it dynamically?

Store in array? Markdown? It won't change often (compared to something like portfolio pieces), so maybe go with the array?

Panel (left): Aspect ratio of contents could be improved

The aspect ratio of the left panel component is mostly accurate, but could use some work. At certain sizes the component could be styled to look nicer.

The end goal is to do it without any extra media queries. CSS Grid should be able to help out.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.