Front-end Coders Meetup -September 2022

The 6th Front-end Coders meetup of 2022 was at Objectivity Mauritius, NEX Tower, Ebene, Mauritius on the 24th September 2022 around the topic of CSS

  • Written by Sandeep Ramgolam

Sandeep Ramgolam

Front-end Coders Meetup -September 2022

The 6th meetup of the year happened, and it was yet another success. This time the theme was much simpler and basic than previous occasions: CSS. The very essence of basic and advanced frontend development. We also planned a fun CSS battle with prizes to give away in the 2nd half of the meetup.

Intro

As it is customary by now, I introduced the frontend coders community to the audience for first-timers and mentioned a few updates.

  1. frontend.mu has completed the switch from Nuxt to Astro
  2. Topics for next meetup
  3. The next meetup(October) will be the last of this year
  4. We have a mission statement for the community

Frontend Coders Mauritius mission statement

"Improve frontend development in Mauritius".

Speakers

  1. Saamiyah Peerun - Styled Components, a state of ambivalence
  2. Sandeep Ramgolam - (near) Future Frontend Development
  3. Michaël Jules - UNO CSS

I welcomed Pritee Gungah-Dabeea, MD at Objectivity to speak about our host for the day.

She gave an overview of the company and welcomed anyone interested in software development to apply for open positions in the company. She mentioned they're especially looking for Senior Angular devs. Many thanks to Pritee & Yashi for supporting our community.

Saamiyah Peerun - Styled Components, a state of ambivalence

Saamiyah kicked off the first technical presentation by introducing the audience to Styled Components. She showed the different ways of doing CSS-in-JS and why they can be useful. She mentioned she did not like it at first, but then it grew on her, and now she prefers this over utility based frameworks like tailwind for big react projects.

I was convinced to consider it seriously for the future as it does seem to bring a sense of stability and uniformity as and when a project would grow in terms of LOC and developers involved.

Sandeep Ramgolam - (near) Future Frontend Development

I was up next. This is the same presentation I gave during the Breakfast Learning Session at Ringier SA one week ago, and I thought it just made sense to share it with the local audience.

I spoke about the origins of CSS and the major evolutions that happened over the years. For me, it's always !important to remember where we came from before we flex where we intend to float to.

After the stroll down memory lane, I spoke about 3 upcoming features i'm excited about, and I think will change radically how modern frontend development will be done hence forth. The same way, media-queries brought about the age of responsive web-design.

  1. Parent Selector ()
  2. Container Queries
  3. Shared Element Transition API

I gave demos of each and explained how the two css features are very easy to use. Just waiting on Firefox to ship those, and we're good.

Michaël Jules - UNO CSS

Mike, who's the best frontend backend developer I know, in other words, a true, full-stack dev spoke about Uno CSS.

He introduced it by talking a little about the author of Uno, Anthony Fu and we were all left wondering if he is a real person, an AI, or a whole company. Because his work-rate is unreal.

Mike showcased the features of UNOCSS by demo'ing his own website, built using that tech, and a special page he made just for today's presentation.

In short, the framework does a lot of things people want in a CSS framework:

  1. Utility Classes
  2. Icons
  3. Extensible via presents
  4. Typography
  5. and many more

There were many questions from the audience comparing it to Tailwind and other CSS frameworks, and it was a lot of fun. These kinds of discussions are one of the reasons our meetups are so much fun.

Lunch

We took a small break for lunch and group photo as usual. Pizzas were delicious!

CSS Battle

It was time for the CSS battle. We had 12 people who brought their own laptops entering the battle. The format was simple, I allocated 30 minutes total to solve any 6 exercises from a predefined list. Anyone who finishes an exercise gets a score, and the people with the highest scores win.

The room grew quite silent 5 minutes in, and we put some metal music to accompany the participants.

It was a lot of fun spectating the coders at work, some were quite stressed, others were chill and making jokes. It went very well.

In the end we had our 3 Winners, Ish, Nythiennzo and Nikhil, who each won a 1 year license for any Jetbrains product. We are grateful to Jetbrains for supporting our community.

Conclusion& Thanks

It was another fun event. Some of us eventually went for a little "after party" at flying dodo to end the evening with some beer.

Thanks to Nirvan, Renghen and Kushul for invigilating during the CSS battle.

Thanks to Kushul for his invaluable helping hand in organizing the meetup and doing a lot of the behind the scene works before the meetup happens.

Thanks to Michaël &Kushul for his advices and help to organize the CSS Battle

Thanks to Mahima for taking care of the RSVP process.

And of course, thanks to everyone who attended. We hope you learned something new.