Frontend Toolkit is a collection of utilities for your repetitive frontend-related tasks. It is customizable and lets you set up everything according to your needs.
Frontend Toolkit is a handy and customizable utility set that simplifies repetitive frontend tasks. It speeds up development by offering ready-to-use tools, reducing boilerplate, and allowing easy configuration to fit different project needs.
Report
Love it!!
Is it open-source? If not, can you please take a request to add "Fake Credit Card Generator" and "UUID Generator"?
Thanks for this project
@justaashir Thank you for the feedback! It isn't open source right now. I will consider it, but need to do some cleanup first. ;) These are great suggestions! I added them on my list (along with a IBAN generator). There is also a button on the website to let me know directly what things you would like to see.
Hey 👋 I created Frontend Toolkit because it frustrated me to switch between different pages to do simple, repetitive Frontend related tasks. I wanted to have all these helpers in one place, organized according to my needs and without distracting ads. I'd appreciate any feedback 🙏
@damian_frizzi Congrats on the launch, here're my $0.02
New widgets:
- JS prettifier
- JS minimizer
- App Icon generation for iOS and Android
- Splash screen generation for iOS and Android
- Base64 decode/encode
- Color tones and swatches
- JSON <-> YAML <-> XML
- Gist creation for JS/TS/JSON
- Linter
- etc
Here's how you make it big:
- create GitHub repo
- create template for a widget (document it really well)
- publish call for contributions
- let ISVs and SaaS generate their own widgets on top of your template
- Collect number of usage per each widget (you play same role NPM does for its packages)
- Let people build dashboards (layouts) and share them. FE engineer, iOS engineer, TS engineer, etc.
- Add mobile clients
- Rinse & Repeat
You are basically creating a new version of jsfiddle + working environment (cloud9) + toolkit + dev networking + trello.
Side note: I'd totally use preset dashboards for different engineers that we onboard for different projects.
In a year you'll have 1M visitors easy.
Hey @eugenehp, thanks a lot for your awesome feedback!
I added all your widget suggestions to my list (except JS prettifier, this is already on the website).
Thank you for your helpful words regarding how to make it big. I've yet to decide if I want to make it open source or not.
I'd really appreciate contributions from other devs but I'm afraid it would take a lot of maintenance time.
But I absolutely see the advantage in letting people integrate their own ideas/presets. I was thinking about a customizable widget, directly accessible from the UI as a compromise.
@damian_frizzi Don't open source the whole thing, just the widget part, enough for folks to contribute their own updates.
look at what vercel.com is doing with a similar approach.
re: maintenance – write clean code, you'll learn a thing or two :) get maintainers, we (devs) are happy to contribute.
also here's a fresh example, servers -> VPS -> serverless
Just declare a single function with in and out, and eval JS file.
Build a list of vetted widgets first, and have a pipeline for checking the rest. People will vote on GitHub issues and will let you know what's needed next.
You own the website and real-estate of each widget, it's your IP and you control it.
Congratulations on the launch @damian_frizzi ! I am a frontend developer myself and I can see how a one-stop solution for all of these needs could be very helpful.
If you're looking for suggestions to expand your existing set of tools, I'd recommend adding a css->css-in-js style converter (I often find myself switching between the two).
Thank you for your feedback, @lorenzosigno_!
I was considering your idea but de-prioritized it because of the sheer amount of CSS-in-JS solutions. Do you have a specific CSS-in-JS solution in mind?
@damian_frizzi I've used the style prop, emotion, styled components—I'm sure there are many others out there.
The syntax, though, is always largely the same. You could start from here 👉 https://cssinjs.org/
Report
@damian_frizzi@lorenzosigno_ I don't agree with this at all. There are so many ways to write JSS and it changes so often. Don't bother. I actually quite like the selection of tools you have. Keep it lean and mean.
Interesting problem you are tackling. We are in the similar problem space but different approach.
get.supernode.ca/signup/
Would love to get your feedback.
Report
Great work. I'd love to know how your image optimisation compares to something like TinyPNG?
@florian_martens I'm currently using Compressor.js (browser based canvas solution) which I assume comes nowhere near to what TinyPNG can achieve. I think it's fine for jpg/webp but I will try to improve the situation for png!
Frontend Toolkit
Frontend Toolkit
Frontend Toolkit
LLC Toolkit
Frontend Toolkit
LLC Toolkit
Frontend Toolkit
Gleek
Fishy Products by Adflow.ai
Frontend Toolkit
Fishy Products by Adflow.ai
Fishy Products by Adflow.ai
Frontend Toolkit
Frontend Toolkit
Frontend Toolkit