Friday, May 10, 2024
HomeCSSCSS { In Actual Life }

CSS { In Actual Life }


The previous few days I’ve been studying lots of people’s end-of-year critiques, the place they share their private {and professional} accomplishments, and their hopes and targets for the yr forward. I wasn’t going to do one among these, however studying all of the others bought me feeling impressed, so right here we’re!

This being (primarily) a CSS weblog, I’m going to maintain most of this based mostly round CSS, or at the very least entrance finish improvement. But it surely’s been an fascinating yr of accomplishments for me personally too, so forgive me if I often deviate into the private. So let’s kick issues off…

What’s new in 2018

CSS {In Actual Life} was born!

One in all my private targets for 2018 was to do extra writing. Writing about net applied sciences is one thing I used to do fairly a bit of some years in the past whereas working as a designer and occasion producer. Switching to entrance finish improvement full time at Mud in 2016, throughout a time of big upheaval in my private life, meant writing was placed on the backburner for some time. It’s one thing I actually missed. I had (and nonetheless have) so many concepts for issues I needed to write down about, I made a decision 2018 was the yr to make it occur.

CSS Grid has me for fairly a very long time – ever since attending Rachel Andrew’s workshop in 2015. (Earlier than that I used to be geeking out about other forms of grids too.) Earlier this yr I grew to become desirous about CSS variables and the way they could possibly be utilized in mixture with Grid to assist handle advanced layouts, because of a undertaking I labored on at Mud. I wrote up a actually fast article (I wrote most of it on the 20-minute prepare journey residence), constructed a shaky proof-of-concept, and revealed it as a weblog put up on Codepen. That put up ended up being extra widespread than I might have imagined, and was extensively shared (over 22,000 views finally depend!). That gave me an enormous enhance, encouraging me to begin this weblog and preserve writing often.

Tremendous-powered layouts

2018 was the yr of CSS Grid, CSS variables and super-powered layouts – at the very least for me. It was the yr we actually began to see Grid being utilized in manufacturing, and extensively talked and written about. Jen Simmons is among the most important individuals main the way in which on this. This yr she launched a YouTube channel, Format Land, and heralded the dawning of a brand new period of net format by coining the time period Intrinsic Net Design to explain the subsequent evolutionary step ahead, past responsive design. This episode of the Large Net Present is effectively price a take heed to get totally in control on what all this implies for net format.

Gatsby

Gatsby is a static web site generator constructed with React – it’s what powers this weblog, in truth. A few colleagues at Mud had been enjoying round with it early this yr and determined to offer it a whirl. I’ve written a put up about it, so I received’t go into all of it right here, however principally it’s very quick, comparatively straightforward for newcomers to familiarize yourself with (you don’t even want earlier data of React – because of the superb docs), and a little bit of a gamechanger within the static web site gen world.

It looks as if different static web site mills are rising and/or upping their sport this yr. Though I can advocate Gatsby, I haven’t used others, so don’t have a lot of a reference level. I’d love to listen to of any you’ll be able to advocate and why!

Firefox

I switched to Firefox as my default browser round October this yr. The dev instruments are unbelievable and getting higher on a regular basis. There at the moment are inspectors for CSS Grid (one of many main promoting factors for me!), accessibility, animation and extra. MDN docs are the go-to for nearly each developer I do know, so to me it is smart to help Mozilla. To not point out having the ability to reclaim a bit little bit of my soul from Google, by now not utilizing Chrome.

With the current information that Microsoft Edge will use the Chromium rendering engine in future, there’s all of the extra motive to help a very unbiased browser and resist a monopoly. Jeremy Keith urges us all to get behind Firefox.

Tailwind

Earlier this yr the Mud staff determined to undertake utility-first CSS – particularly the framework Tailwind. After six months or so of utilizing it, I can undoubtedly see the advantages, and on the entire it was the correct method for us to undertake as a staff. That’s to not say I’m an advocate for a utility-first method in each state of affairs, and there are specific drawbacks to counteract the positives. I’ll share my ideas in a put up within the subsequent few weeks. Within the meantime, right here’s a nice article by Sarah Dayan that breaks down why utility-first CSS is price contemplating.

Private achievements in 2018

It’s been an thrilling yr for me personally. I spoke at 4 occasions, and revealed 20 articles, together with two articles for CSS Tips – a serious life aim! In November the writing took a little bit of a dip as I spent the month studying React. (I took Wes Bos’s React for Novices course, which I totally advocate.) In December I began a brand new job at Ordoo. I’m actually excited to have the prospect to work on a product and have a number of inventive enter, in addition to placing my new discovered React data into apply!

What’s not so nice in 2018

In fact, it’s laborious to speak about 2018 with out desirous about the large political shitstorm (there actually isn’t any different phrase for it) occurring on each side of the Atlantic. I don’t have a lot to say right here that hasn’t already been stated, and by way more articulate individuals than me. As a lot as I like working on the internet, it could actually really feel like what we’re doing is insignificant in comparison with the horrible, horrible issues on this world. However alternatively, it makes me really feel like creativity, dialog and studying for studying’s sake are extra necessary now than ever.

Waiting for 2019

Now we’re onto the great half! These are the brand new CSS specs that I’m actually enthusiastic about – hopefully coming to a browser close to you in 2019!

Side ratio

We’ll quickly have the ability to outline side ratio on a picture (or certainly on something!) in CSS! No extra padding hacks! That is a part of the Intrinsic and Extrinsic Sizing Module Degree 4, and remains to be in tough draft. Is it an excessive amount of to hope it’ll land in 2019? Perhaps. However I’ll keep hopeful!

Subgrid

Subgrid (the place the kids inherit the grid of the father or mother container) is the primary new characteristic within the CSS Grid Format Module Degree 2 spec. It’s in all probability one of many most-requested options in Grid, and goes to make Grid an much more sensible selection for layouts. Rachel Andrew has a superb breakdown of what it means. The spec is in Working Draft, however we shouldn’t have too lengthy to attend!

Setting variables

In a nutshell, CSS surroundings variables are like world variables. Ire Aderinokun summarises them properly in this text. The spec is in Editor’s Draft and can in all probability change – however some browsers are already supporting it, that means you’ll be able to mess around if you happen to’re curious.

Targets for this weblog

In 2019 I wish to preserve persistently writing on this weblog, hopefully publishing fortnightly at a minimal. One of many issues I had at all times meant to do with this weblog is to share shorter and extra frequent posts and code snippets from the tasks I’m engaged on in on a regular basis life. That didn’t find yourself occurring, as each time I began writing an article I ended up taking place a rabbit gap and writing a number of hundred extra phrases than I deliberate to!

Running a blog was at all times meant to be an satisfying factor for me, so I don’t wish to stress about it if life generally will get in the way in which. Hopefully I’ll preserve writing and folks will preserve studying 🙂

I do wish to make some enhancements: Including pagination, tagging and search performance all really feel fairly very important because the variety of posts grows. So look out for some enhancements over the subsequent few months.

I additionally wish to begin including some higher illustrations into my weblog posts. I studied illustration for my diploma, and used to do fairly a little bit of freelance illustration work, which has been put apart for some time. I’d prefer to weave that into my posts by some means!

Private targets

I’m not one for setting huge, bold targets that I then really feel underneath stress to finish over the course of a yr. However these are some issues I’d love to do in some unspecified time in the future in 2019:

Get higher at public talking

I spoke at 4 occasions this yr, however I nonetheless don’t really feel I’m nice at it. The suggestions I’ve had has been constructive, however it doesn’t come naturally to me, and I nonetheless get nervous. Doing it has been an incredible confidence enhance at instances, and a great way to fulfill individuals.

Do extra drawing

This one doesn’t want a lot explaining, however it’s one thing I wish to find time for with out having the stress of a deadline.

Spend extra time with my household and fewer time stressing

I’ve labored actually laborious in 2018, and whereas I actually received’t be resting on my laurels, I wish to give myself a little bit of a break in 2019 to be wholesome, and spend much less time in entrance of the display screen.

Comfortable New Yr, and finest needs for a profitable 2019 – no matter that appears prefer to you!

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

Most Popular

Recent Comments