Searching for a "cute" Full-Stack for React? Try GatsbyJS / Bulma

Hello fellow coders,

After using for many years jQuery / Bootstrap and Flask (for the backend) I decided to change a little bit the picture to Gatsby and Bulma CSS.

These days, developers can scaffold web applications quite fast using many tools, (Yeoman .. etc) but we should take into account the use Gatsby along with Bulma for some good reasons:

The first one is the speed :)

Secondly, Gatsby became quite popular thanks to the JAM Stack implementation. It has a huge community around it and automatized deployment on Netlify. It's stable, well documented, and offers "out-of-the-box" modules for sitemaps, authentication, development tooling, and GraphQL, which is amazing, btw.

And finally, Bulma CSS framework is also well documented, it has cute CSS markers like "is-primary" / "is-large" for buttons and automatic cells alignment. All this making usage and integration really easy. I must mention also that Bulma is built with Flexbox.

By using this stack, a developer can easily create a new web apps using a few basic commands:

npm install -g gatsby-cli // install gatsby console globally
gatsby new gatsby-bulma https://github.com/rosoftdeveloper/fullstack-gatsbyjs.git // clone the sample starter
cd gatsby-bulma
npm install // intall deps
gatsby develop // edit your code with LIVE update in browser
gatsby build // prepare for production
npm run deploy // live deploy (please edit deploy.js first) 

Basically, the above commands will provide a basic setup for the Gatsby tool and the demo starter. Live deploy script included :)

Next steps for this starter:

• add authentication ( Basic, OAuth, 2fAuth )
• integrate Stripe
• Something is missing? please suggest :)

Resources:

• Demo: Full-Stack GatsbyJS
• Sources: Github, MIT Licence, of course
• GatsbyJS framework
• Bulma.io - CSS Framework