David van Zyl Portfolio Home

Portfolio 2019

At least once a year I rebuild my portfolio with some new library, framework or set of tools that look particularly interesting. Too much free time I guess.

This is my portfolio for 2019, the first one at least.

I had been using React for a while when I found out about Gatsby, a static progressive web app (PWA) generator, from a friend of mine over at Roboto Studio (who are also responsible for the design - links below). Gatsby fundamentally supports the JAM (JavaScript, API, Mobile) stack and lets you build templates using all the best web technologies – ReactJS, Webpack , and any CSS preprocessor you like. Let's face it though, SCSS is the way.

Unlike me, it has no opinion on how you build your site including where you get your data. If you want a CMS, straight markdown files, or just data direct from some API you're all set. Theres no real limit here, and you can do it all with GraphQL. If you like.

Using all the best behind the scenes gives you all the power that comes with that translated into static pages with lazy loading for a lightning quick site.

As for my data source, I'm using Prismic. This CMS is a great partner to React, partly because of a thing called 'Slices'. Put any content you like in your pages and let the code set up the template with some dynamic element creation. It's a really great system that gives you a ton of freedom. I'll put an example of how this could work at the end.

Now just so you know, I'm not sponsored by any of these. Offers are welcome though. I just heard about them and after a bit of looking around, I tried them and enjoyed the possibilities it provided. For much the same reasons I like React to begin with.

Let me know what you think, my socials are all linked in the footer.

Check out the greatest design and development studio the north is likely to see -> Roboto.Studio

const TagName = this.props.tag_name
this.componentList = this.props.items.map(item => <TagName item={item} />)