I Built a Full-Stack Blog Builder (beemy) - Self-Taught Developer Story

This page summarizes the projects mentioned and recommended in the original post on reddit.com/r/webdev

Our great sponsors
  • Scout APM - Truly a developer’s best friend
  • Zigi - Close all those tabs. Zigi will handle your updates.
  • InfluxDB - Build time-series-based applications quickly and at scale.
  • Sonar - Write Clean JavaScript Code. Always.
  • react-beautiful-dnd

    Beautiful and accessible drag and drop for lists with React

    react-dnd + react-beautiful-dnd - Used these for my drag-and-drop functionality for my blog builder (to drag articles to a blog builder component). I used to 2 drag and drop libraries because I wanted to cry after a day and a half of fiddling with react-dnd to try and create a sortable list. So I gave up and installed react-beautiful-dnd for my sortable list. If I were to do it again, I would opt for dnd-kit. It comes with drag and drop + sortable lists. I picked react-dnd initially because I wanted a lightweight library.

  • MongoDB

    The MongoDB Database

    MongoDB - I remember doing a lot a lot of research for which database to use. Fundamentally, I came to the conclusion that the most important aspect of a database is the number of features and speed of development, not cost. I don’t come from a SQL background, so the document-based query language wasn’t that unnatural for me. MongoDB also provides really specific and granular updates once you learn it. It also offers search! I don’t have experience with other databases, but I haven’t had any complaints with MongoDB so far.

  • Scout APM

    Truly a developer’s best friend. Scout APM is great for developers who want to find and fix performance issues in their applications. With Scout, we'll take care of the bugs so you can focus on building great things 🚀.

  • Sass

    Sass makes CSS fun!

    SASS - I know there are a lot of new styling libraries out there like tailwind and styled-components, but I still just prefer regular CSS. SCSS is nice cause I can nest styles.

  • Next.js

    The React Framework

    Next.JS - To be honest when I chose this framework I was going with what was most popular at the time. I had no idea what the difference between server and client rendering was or their respective use cases. But this was probably one of the best decisions because Vercel (the company that created Next.JS) made a really really good framework that makes building websites so much more enjoyable. I don’t have to think about the small configurations - Next.JS handles it for me. I remember at the time I was deciding between Next.JS and Gatsby and I am so glad I opted for Next.JS since it now seems like Next.JS is the preferred React framework.

  • next-auth

    Authentication for Next.js

    next-auth - Authentication took me a very long time to figure out. If you are trying to implement a full authentication mechanism with next-auth, know that it is possible. Specific examples aren’t heavily documented, but you can accomplish certain custom authentication steps by manipulating tokens and URL variables.

  • Editor.js

    A block-styled editor with clean JSON output

    Editor.JS - I first discovered this when I was doing a tutorial online from Frontend Masters. It’s a really solid editor that comes with a lot of prebuilt components. They use classes for components which does take some time to get used to if you are coming from React functional programming, but I think it's the best-looking open source editor as of now. You can also indirectly incorporate React components in the class render function, so its not that bad - here is a tutorial I found online on how to do that.

  • dnd-kit

    The modern, lightweight, performant, accessible and extensible drag & drop toolkit for React.

    react-dnd + react-beautiful-dnd - Used these for my drag-and-drop functionality for my blog builder (to drag articles to a blog builder component). I used to 2 drag and drop libraries because I wanted to cry after a day and a half of fiddling with react-dnd to try and create a sortable list. So I gave up and installed react-beautiful-dnd for my sortable list. If I were to do it again, I would opt for dnd-kit. It comes with drag and drop + sortable lists. I picked react-dnd initially because I wanted a lightweight library.

  • Zigi

    Close all those tabs. Zigi will handle your updates.. Zigi monitors Jira and GitHub updates, pings you when PRs need approval and lets you take fast actions - all directly from Slack! Plus it reduces cycle time by up to 75%.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts