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?
First things first; domain name.
http://toolsforsaas.com"> http://toolsforsaas.com seems to be available, let& #39;s register it!
http://toolsforsaas.com"> http://toolsforsaas.com seems to be available, let& #39;s register it!
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!
. @airtable for data
. @GatsbyJS for a static site
. @netlify or @vercel for hosting
. @algolia for search
All these tools are available for free btw!
Up next: Build an MVP
MVP is up and running
https://abs.twimg.com/emoji/v2/... draggable="false" alt="👉" title="Rückhand Zeigefinger nach rechts" aria-label="Emoji: Rückhand Zeigefinger nach rechts"> https://toolsforsaas.com"> https://toolsforsaas.com
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">
Feel">https://airtable.com/shrQgSTcw... free to copy it
Update: so . @airtable haven& #39;t upgraded my account
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 used . @integromat to create the automation for free.
In my Airtable tools base I added a new column called "preview_status" to tell . @integromat which tool is missing a preview image.
Here is what my scenario looks like.
In my Airtable tools base I added a new column called "preview_status" to tell . @integromat which tool is missing a preview image.
Here is what my scenario looks like.
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
It& #39;s starting to take shape
Up next:
- Add category navigation
- Add single tool page for more details
- Add site analytics and make it public
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">
Up next:
- Detailed tools pages
Preview of category page
Step 1: Create a custom hook on Vercel
Step 2: Add a scenario with an HTTP request to trigger that hook!
Update:
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Details tools pages
See a live preview 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://toolsforsaas.com/hosting/netlify ">https://toolsforsaas.com/hosting/n...
See a live preview here
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">
- Add tools logos
- Add more tools
Again, I will not manually provide logos images. I will use . @integromat to automate this for me
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.
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!
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"> Improve site header + navigation
https://abs.twimg.com/emoji/v2/... draggable="false" alt="✅" title="Fettes weißes Häkchen" aria-label="Emoji: Fettes weißes Häkchen"> Update site branding
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
For logos, I used . @clearbit free logo api + Integromat to fetch and populate images into . @airtable