Styling React Components Using Stratos Design Tokens
If seeing is believing, then I guess we need to show as much as possible of what you can do with Stratos Tokens App. TLDR;… Read More »Styling React Components Using Stratos Design Tokens
Fredrik Ward
Fredrik’s front-end quick read #14
What does: How to achieve an image “blur up” effect using only about 20 characters A CSS section separator generator (?!) Tim Kadlec exploring… Read More »Fredrik’s front-end quick read #14
The Nine Rules of Stratos Design Tokens
Finally Team Sketch2React has created a design document containing examples of all the rules available in Stratos Tokens App! We’ve created the demo document in… Read More »The Nine Rules of Stratos Design Tokens
Alter Your Stratos Tokens project’s Configuration to Supercharge Your Design Tokens
Amazing artwork by Rusty Shackles Stratos Tokens App is shipped with, out of the box support for Amazon Style Dictionary. We (Team Sketch2React) chose to support… Read More »Alter Your Stratos Tokens project’s Configuration to Supercharge Your Design Tokens
Fredrik’s front-end quick read #13
Lighthouse makes changes as to how performance score is calculated. Bootstrap 5 is (almost) around the corner and it seems to drop support for both… Read More »Fredrik’s front-end quick read #13
How to combine Design Tokens, defined in your design tool, with Material-UI using Stratos Tokens…
TLDR; Design tokens and styling in Material-UI is surprisingly closely related and in this article I’ll explain why and show you how you can benefit… Read More »How to combine Design Tokens, defined in your design tool, with Material-UI using Stratos Tokens…
From Design tool to Design Tokens using Stratos App
TLDR; Stratos Tokens App reads the raw design file (no plugins) and generates a design token file (JSON-format). This file can then be either stored… Read More »From Design tool to Design Tokens using Stratos App
Fredrik’s front-end quick read #12
New year, new things to learn! Read on to learn how to make a grid-powered resume, what happened to React in 2019, if the Weird… Read More »Fredrik’s front-end quick read #12
Sketch app + weird layer names = React code!?
If you’ve come in contact with Sketch2React or Stratos chances are big that you’ve also encountered the weird layer naming convention a.k.a. our markup. It… Read More »Sketch app + weird layer names = React code!?
Can Sketch App symbols be made into React components?
TLDR; Yes 
. With some ?? and bit of ?we made it possible in Stratos alpha version 2. Even though the React-code generated by Stratos… Read More »Can Sketch App symbols be made into React components?
Fredrik’s front-end quick read #11
The end of yet another year is upon us, and what can I say… Front-end development is moving crazy-fast, so enjoy some holiday merriment, relaxation… Read More »Fredrik’s front-end quick read #11
Fredrik’s front-end quick read #10
In this issue you’ll find a solution for the “full-height” issue on mobile, Compress JSON into URL-friendly strings, a different approach to commit messages, 2019… Read More »Fredrik’s front-end quick read #10
Fredrik’s front-end quick read #9
The formation of Bytecode Alliance has been announced, The result of the Front-end tooling survey 2019, a business case for dropping IE11, SMS Receiver API… Read More »Fredrik’s front-end quick read #9
Fredrik’s front-end quick read #8
Happy birthday W3C, you are now too old to enroll as a trainee in the Indian Merchant Navy. Sass Modules has arrived, Firefox DevTools has… Read More »Fredrik’s front-end quick read #8
Fredrik’s front-end quick read #7
Learn React in 10 tweets, 127 Helpful JavaScript Snippets You Can Learn in 30 Seconds or Less, Webhint has found it’s way into Firefox DevTools,… Read More »Fredrik’s front-end quick read #7
Fredrik’s front-end quick read #6
Wikipedia is on a 28KB javascript target diet, Browser engine diversity is ever decreasing, Google has revised its guidelines for rel, console contains a lot… Read More »Fredrik’s front-end quick read #6