DEV Community

Cover image for The revolution in Front-end Development is here

The revolution in Front-end Development is here

vsblox on November 08, 2021

Hi everyone, I’m Bruce and I’m a DevRel at blox. Me and my team are excited to bring you the alpha release of blox What is blox? blox ...
Collapse
 
grahamthedev profile image
GrahamTheDev • Edited

The concept is great ❤.

However...(sorry, criticism incoming)

WCAG Acessible
Every block follows WCAG guidelines and provides an accessible experience for every user

In your short 24 second video showcasing a component you have the following issues:

  1. tabindex="0" on everything - making keyboard navigation next to impossible as every item will be keyboard focusable, which is not how you make a page accessible.
  2. headings right next to each other - within that one block You have a <h1> followed immediately by a <h2> then a <h3> followed immediately by a <h4>. This is completely wrong I am afraid, stacked headings are bad, having all elements in a component be headings is even worse and not something I have seen before!
  3. role="image"...on an <img> - you have fallen into the aria trap and over used it. Only use WAI-ARIA as a last resort. (technically not a fail, just a bad practice!)

I would imagine a lot of the other templates will have similar or worse issues if that is the pattern that has been followed.

I would suggest removing the claim of "WCAG accessible" entirely as that is dangerous and completely false, so it may open you up to litigation (lawsuits).

Also bear in mind that (new) developers will think they have done the right thing and picked an accessible library and it is sadly the exact opposite.

I hope the project takes off as I like the idea a lot and I hope it generates a nice income for you, but perhaps reinvest the first income you receive into getting an accessibility expert to rewrite your templates (and if they are templates taken from elsewhere then write your own!) and then you can indeed make the claim that they are WCAG accessible (to the extent that they can be, certain components require JavaScript to be accessible as you need to change WAI-ARIA attributes on them)!

Good luck with the project!

Collapse
 
bruceblox profile image
vsblox

Our main goal is to improve the developer experience so we do appreciate the feedback and look forward to hear more!

Collapse
 
thumbone profile image
Bernd Wechner

I find it a bit hard to reconcile a VS code extension with a "revolution in front-end development". Maybe I'll grant it's a "revolution in using VS Code for front-end development".

Collapse
 
aqkhan profile image
A Q Khan

out of curiosity, have you even tried the extension? what was your experience?

Collapse
 
thumbone profile image
Bernd Wechner

Nope. Don't use VS Code. ;-). Not am I likely to really.

Collapse
 
m4rcoperuano profile image
Marco Ledesma

This looks great from a marketing perspective. However if you’re goal is to build web applications, it doesn’t look like a good fit. Still, cool feature for VSCode. I think the word “revolution” is a big leap; but it’s neat nonetheless.

Collapse
 
bruceblox profile image
vsblox

Appreciate the feedback. For webapps, these are the building blocks to fast track the workflow. We'll soon be publishing tutorials on building web apps through blox for a better demonstration.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀 • Edited

Although this is cool, you can as of very recently use VSCode in a browser officially vscode.dev/ so this becomes a mute point?

Collapse
 
bruceblox profile image
vsblox

I think you missed the drop-in ready code blocks part.

Collapse
 
adam_cyclones profile image
Adam Crockett 🌀

Probably 😋 I'm dyslexic

Collapse
 
lil5 profile image
Lucian I. Last

Looks like a whole load of marketing around an bad excuse not to use a template language, GoLang template/html | PHP smarty, blade | NodeJS ejs, mustashe