https://abs.twimg.com/emoji/v2/... draggable="false" alt="🤔" title="Denkendes Gesicht" aria-label="Emoji: Denkendes Gesicht">

I just launched my first small SaaS @bannerswipe and now I& #39;m looking for the "right" tools to use.

Is there a site that lists the best SaaS tools?
Hmmm, I couldn& #39;t find anything interesting...

Let& #39;s build this!
First things first; domain name.

http://toolsforsaas.com"> http://toolsforsaas.com  seems to be available, let& #39;s register it!
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Register http://toolsforsaas.com"> http://toolsforsaas.com 

Up next: Choose a tech stack for the website
Ok. So I& #39;m building a list of the best SaaS tools around. It makes sense to use the best tools to build this list...

. @airtable for data
. @GatsbyJS for a static site
. @netlify or @vercel for hosting https://abs.twimg.com/emoji/v2/... draggable="false" alt="🤔" title="Denkendes Gesicht" aria-label="Emoji: Denkendes Gesicht">
. @algolia for search

All these tools are available for free btw!
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Choose a tech stack for the website.

Up next: Build an MVP
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Build an MVP

Up next:
- Add more tools
- Add image previews of tools
- Add more details (like pricing, category, etc.)
For those wondering. Here is what my . @airtable table looks like https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">
If you& #39;d like to copy this product or just mess with code, source is available here https://abs.twimg.com/emoji/v2/... draggable="false" alt="👉" title="Rückhand Zeigefinger nach rechts" aria-label="Emoji: Rückhand Zeigefinger nach rechts"> https://github.com/wassim/toolsforsaas">https://github.com/wassim/to...
For image previews, I don& #39;t want to manually take the screenshot for each tool https://abs.twimg.com/emoji/v2/... draggable="false" alt="🤣" title="Lachend auf dem Boden rollen" aria-label="Emoji: Lachend auf dem Boden rollen"> so I will use . @airtable automation function and a screenshot api service like . @apiflash_com
Dear @airtable could you please upgrade my account so I can use the automation function with script run and also show people how to use it? https://abs.twimg.com/emoji/v2/... draggable="false" alt="🤔" title="Denkendes Gesicht" aria-label="Emoji: Denkendes Gesicht">
Btw my . @airtable base is publicly viewable here https://abs.twimg.com/emoji/v2/... draggable="false" alt="👉" title="Rückhand Zeigefinger nach rechts" aria-label="Emoji: Rückhand Zeigefinger nach rechts"> https://airtable.com/shrQgSTcwtRWpsRZS

Feel">https://airtable.com/shrQgSTcw... free to copy it https://abs.twimg.com/emoji/v2/... draggable="false" alt="🙂" title="Leicht lächelndes Gesicht" aria-label="Emoji: Leicht lächelndes Gesicht">
And just like that, image preview of tools are automatically filled for me https://abs.twimg.com/emoji/v2/... draggable="false" alt="🙈" title="Nichts sehen-Affe" aria-label="Emoji: Nichts sehen-Affe">
Took a break. Back to this.

https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added image previews
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added free/trial information
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Made small aesthetics improvements

It& #39;s starting to take shape https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">

Up next:
- Add category navigation
- Add single tool page for more details
- Add site analytics and make it public
Took a break. Back to this.https://abs.twimg.com/emoji/v2/... draggable= Added image previewshttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added free/trial informationhttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Made small aesthetics improvementsIt& #39;s starting to take shape https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">Up next:- Add category navigation- Add single tool page for more details- Add site analytics and make it public" title="Took a break. Back to this.https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added image previewshttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added free/trial informationhttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Made small aesthetics improvementsIt& #39;s starting to take shape https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">Up next:- Add category navigation- Add single tool page for more details- Add site analytics and make it public" class="img-responsive" style="max-width:100%;"/>
Update:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added . @usefathom analytics code
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added categories pages + header navigation

Up next:
- Detailed tools pages

Preview of category page https://abs.twimg.com/emoji/v2/... draggable="false" alt="👇" title="Rückhand Zeigefinger nach unten" aria-label="Emoji: Rückhand Zeigefinger nach unten">
Update:https://abs.twimg.com/emoji/v2/... draggable= Added . @usefathom analytics codehttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added categories pages + header navigationUp next:- Detailed tools pagesPreview of category page https://abs.twimg.com/emoji/v2/... draggable="false" alt="👇" title="Rückhand Zeigefinger nach unten" aria-label="Emoji: Rückhand Zeigefinger nach unten">" title="Update:https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added . @usefathom analytics codehttps://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Added categories pages + header navigationUp next:- Detailed tools pagesPreview of category page https://abs.twimg.com/emoji/v2/... draggable="false" alt="👇" title="Rückhand Zeigefinger nach unten" aria-label="Emoji: Rückhand Zeigefinger nach unten">" class="img-responsive" style="max-width:100%;"/>
https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen"> Note: to not have to manually deploy my site each time I add a new tool on Airtable, I& #39;ve added an Integromat automation that do this for me https://abs.twimg.com/emoji/v2/... draggable="false" alt="🙈" title="Nichts sehen-Affe" aria-label="Emoji: Nichts sehen-Affe">.

Step 1: Create a custom hook on Vercel
Step 2: Add a scenario with an HTTP request to trigger that hook!
Note: All texts are generated dynamically from . @airtable data so I could spend less time on copy.
Up next:
- Add tools logos
- Add more tools

Again, I will not manually provide logos images. I will use . @integromat to automate this for me https://abs.twimg.com/emoji/v2/... draggable="false" alt="😎" title="Lächelndes Gesicht mit Sonnenbrille" aria-label="Emoji: Lächelndes Gesicht mit Sonnenbrille">
That& #39;s it for today lads. See y& #39;a tomorrow for more updates https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">
Hi everyone https://abs.twimg.com/emoji/v2/... draggable="false" alt="👋" title="Waving hand" aria-label="Emoji: Waving hand"> I& #39;ll continue to build @toolsforsaas publicly in this thread starting from 4pm today (gmt+1). Stay tuned https://abs.twimg.com/emoji/v2/... draggable="false" alt="👀" title="Augen" aria-label="Emoji: Augen">
Back to building https://abs.twimg.com/emoji/v2/... draggable="false" alt="👨‍💻" title="Man technologist" aria-label="Emoji: Man technologist">. So let& #39;s recap what happened yesterday. I got an idea for a small product, decided to build it publicly and make source code available for everyone.

Let& #39;s see if awesome builders like @levelsio and @AndreyAzimov could RT this thread for more reach.
What I have done so far:
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Build an MVP ( https://toolsforsaas.com"> https://toolsforsaas.com )
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Add some data
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Improve the design

Up next:
- Add products logos via an automated process (will show you how)
- Improve the site header part

Let& #39;s go!
Update:

https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Add companies logos
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Various code & aesthetics improvements

For logos, I used . @clearbit free logo api + Integromat to fetch and populate images into . @airtable
That& #39;s if for this thread. I& #39;ll keep you posted on product updates outside the thread. Thanks for everyone who followed along https://abs.twimg.com/emoji/v2/... draggable="false" alt="👋" title="Waving hand" aria-label="Emoji: Waving hand">
You can follow @wassimdotco.
Tip: mention @twtextapp on a Twitter thread with the keyword “unroll” to get a link to it.

Latest Threads Unrolled: