Gatsby + Figma + Netlify = Free Landing Page
So i've been using figma for 2 years and i enjoy designing it. I learn how to make a simple landing page design. One of my maker friend @mddanishyusuf (founder of nocodeapi.com) help me out in the coding for gatsby and open source the code.
A year ago i made a no-code game called "supermakers" and got #4 product of the day on producthunt.com I enjoy making the no-code game and share it with the community. I use withkoji.com to make the game. Bought a domain on namecheap and also deploy the website on netlify and upload my repo on github.com
Join JAMStack Makers: https://t.me/JAMstackmakers
Subscribe my substack: https://fajarsiddiq.substack.com/p/gatsby-figma-netlify-free-landing
Trending on Indie Hackers
Is there a way to actually export the gatsby styles from figma? Or is it more like you create a design and then code it up in Gatsby?
create design first then code it.
for now i don't think so they can do that.
tools/plugins:
https://www.animaapp.com/figma
https://figma.pizza/
https://avocode.com/
https://audacitus.com/figpress
https://figma-html.netlify.app/
https://www.figma.com/community/plugin/747985167520967365/HTML-To-Figma
https://www.figma.com/community/plugin/753195897635985866/HtmlGenerator
Productized services:
https://ui2html.net/services/figma-to-html.html
https://nextbigtechnology.com/figma-to-html/
https://www.xhtmlchop.com/figma-to-html.html
https://www.mockuptocode.com/
https://imado.co/figma-to-html
https://www.xfive.co/service/figma-to-html/
https://www.fiverr.com/gigs/figma-to-html
https://www.reliablepsd.com/figma-to-html-and-wp/
Nice website Fajar, but it is not very responsive. Maybe that’s the downfall of using Figma? I’m not sure but I hope this helps you steer on the right path.
I was using an iPad on Safari and it was way too big for the screen.
i use figma on mbp, for the website is responsive
Well I’m assuming that you only used one frame size to create the website. If it was for the mbp that means it only works for Mac books or other screens that have the same dimensions. That may be the downside of using Figma. Still though, a great accomplishment. I haven’t seen anyone use Figma for a main tool in Jamstack. Congrats! 🥳
thanks dude!