What Technologies Would You Use to Build a Personal Site Today?

2 responses to “If creating a personal site from scratch today, what tech stack would you choose?”

1. Creating a personal site from scratch today involves leveraging modern web technologies to ensure your site is efficient, visually appealing, and maintains ease of use and updating. Here’s a recommended tech stack and approach for creating a simple, mostly static site with a contact form and a blog section:

   Frontend

   1. HTML5 and CSS3:
   2. Use HTML5 for semantic markup, which improves SEO and accessibility.

   3. Use CSS3 for styling with a modern layout using Flexbox or CSS Grid.

   4. JavaScript:

   5. Keep the JavaScript lightweight since the site is mostly static.

   6. Use vanilla JavaScript or a minimal library/framework like Alpine.js for any interactive parts or DOM manipulation.

   7. CSS Framework:

   8. Tailwind CSS: A utility-first CSS framework to speed up development while keeping the design customizable.
   9. Alternatively, use Bootstrap if you prefer a more component-based framework with a pre-defined style.

   Static Site Generator (SSG)

   1. Next.js:
   2. Although Next.js is a React framework, it is also effective for generating static sites while offering server-side rendering and API routing capabilities if needed in the future.

   3. It supports Markdown out of the box, which is great for your blog section.

   4. Eleventy (11ty):

   5. A simpler alternative for generating static sites. It is highly customizable and supports templates like Nunjucks, Liquid, and Markdown.

   Backend and Contact Form Handling

   1. Form Backend Service:

   2. Use services like Formspree or Netlify Forms to handle form submissions without setting up a backend.

   3. Serverless Functions:

   4. If you need more control over the form handling, consider using serverless functions with a platform like Vercel or AWS Lambda to manage backend logic.

   Hosting

   1. Netlify / Vercel:
   2. Both offer seamless integration with Git repositories, automatic deployments, and are optimized for static sites.
   3. They also provide addons/solutions for form handling and serverless functions.

   Blogging Platform/Integration

   1. Markdown with SSG:

   2. Use Markdown files for blog posts. Leverage the SSG’s ability to convert these into static pages.

   3. Content Management:

   4. Integrate a headless CMS like Contentful or Sanity if you prefer a more UI-driven

   Reply

2. Great topic! As you consider the tech stack for your personal website, I would recommend exploring a combination of modern tools that not only enhance functionality but also streamline your workflow.

   For the front end, a popular choice is **React** or **Vue.js** for building a responsive and high-performance UI. Both frameworks offer excellent component-based architectures, making it easier to manage your site as it grows. If you’re looking for something simpler, **Svelte** is gaining traction for its straightforward syntax and smaller bundle sizes.

   For styling, utilizing a CSS framework like **Tailwind CSS** can significantly speed up your design process while ensuring your site remains visually appealing. It allows for customization without the bloat of traditional frameworks.

   On the backend, consider using **Node.js** with **Express** to handle your server logic, along with a lightweight database like **MongoDB** or even **SQLite** if your site remains relatively simple. Alternatively, leveraging **Static Site Generators** like **Gatsby** or **Next.js** can provide the benefits of speed and security, especially for a primarily static site.

   Lastly, don’t forget about deployment and maintenance. Platforms like **Vercel** or **Netlify** offer seamless deployment for static sites with built-in CI/CD, making the process efficient and hassle-free.

   Incorporating these technologies can give your site a robust foundation, ensuring performance and scalability as your online presence grows. Can’t wait to see how your new site turns out!

   Reply