Visual Studio Code Course

Alex Lab — Thu, 28 May 2020 11:06:08 +0000

Hello! 👋

I started a my first tutorial and it's a Visual Studio Code Course on Youtube!

It will cover everything you know to get started but also giving you tips that I use on my professionnal workplace.

What video would you like to see or topic covered?

VSCode frustration to VSCode love ♥

Alex Lab — Fri, 21 Jun 2019 09:16:49 +0000

The frustration 😖

This story starts in your (at least mine) favorite code editor: VSCode.
What's great about VSCode is all the tools available to the community to enable you to make your code editor like your own little bubble.

✨ You can download a tons of extensions, add snippets, change the layout and of course, change the theme ! ✨

So here was my VSCode:

I used Material Theme Palenight High Contrast, really loved the colors but I had one problem:
Highlight selection was hard to see, when I wanted to quickly select a typo or change a name, I quickly selected the entire word and got frustrated from it.

Here is it while selecting 'commander' on line 15 with Material Theme Palenight High Contrast:

Here is it while selecting 'ander' on line 15 with Material Theme Palenight High Contrast:

As you can "see", the difference is very low and it's hard to notice what you are currently selecting. 🧐

To avoid this, I switched to the High Contrast theme built in VSCode and I know, you might criticize it and saying that your design eyes are bleeding but hey, at least I now can see what I was selecting.

Here is it while selecting 'commander' on line 15 with the High Contrast Theme:

Here is it while selecting 'ander' on line 15 with the High Contrast Theme:

After a while, you are accustomed to the theme and your eyes stop bleeding don't worry. 🤩

But what I mainly noticed, was that the High Contrast was very well made to avoid visual conflicts.

The research 💻

I had my highlight issue fixed but colors where not really my taste. So I looked on the marketplace for a nice theme with a great highlight contrast but couldn't find one that fit my taste.

Instead, I found an article from Sarah Drasner on how to create a VS Code theme.

Loved this article and so I decided to make my own theme: a nice looking High Contrast Theme.

So first I had some issues to register as a developer on the Azure DevOps platform.

So maybe it took me more 20-30 minutes to understand what I needed instead of 5-10min but here I am now, I can publish on it. ⏱

So if you follow the css-tricks article, you easely find how to generate a theme template and start to create.
Also, the VS Code documentation is really well made to customize everything and you can inspect VSCode like a browser, because it's just an Electron app ! 👌

I wanted my theme High Contrast and I picked the colors on colorsafe.com to have AAA level colors on WCAG Standard. Only one was AA level to make my theme prettier.

So here is it: Save Eyes HC Theme 👁!

You can find it here on the marketplace: Save Eyes HC Theme.

And of course, you can see what you are selecting ! 🔥

Here is it while selecting 'commander' on line 15 with the Save Eyes HC Theme:

Here is it while selecting 'ander' on line 15 with the Save Eyes HC Theme:

The light theme 💡

On a slack channel of my company, I saw a link about the dark side of dark mode where tldr; was: for most of us light themes are better

Well, I made one and use it now everyday and it's awesome !

Here is a little preview:

Of course it's on the marketplace: Save Eyes Light 👁

Contribute 💪

Of course a theme is made to be used, improved for the needs.

If you use it, you may encounter issues in specific cases I didn't encounter so I would love an issue so I can fix it, or maybe you know want to tackle it a made a PR !

All repos are available in the theme page on the marketplace !

And yes, also if you don't like it, I would love to hear why so maybe I can make the theme of your dreams :)

Happy coding VSCode friends ! 💻✨

Can we compare Rust with WASM and ReasonML in the frontend future ?

Alex Lab — Tue, 16 Apr 2019 17:38:17 +0000

ReasonML is here for a while but seem not very welcomed by the frontend community, yet. As Rust is strongly pushed by Mozilla throw WebAssembly.
How would you compare them together, how do you see their places in the future ?