Ask HN: What novel tools are you using to write web sites/apps?

This page summarizes the projects mentioned and recommended in the original post on news.ycombinator.com

Our great sponsors
  • Appwrite - The Open Source Firebase alternative introduces iOS support
  • Klotho - AWS Cloud-aware infrastructure-from-code toolbox [NEW]
  • Sonar - Write Clean JavaScript Code. Always.
  • InfluxDB - Build time-series-based applications quickly and at scale.
  • hotwire-rails

    Use Hotwire in your Ruby on Rails app

    Fav thread ever!

    A good 5+ years ago I built HasGluten [1] with react backed by a google spreadsheet, hosted on github pages. Proven technology, it's still working.

    More recently I hacked together MultiPreview [2] with react + API served by firebase functions. I'm also temp using firebase hosting as I have little traffic, but plan to replace it with edge computing / CDN caching.

    MultiPreview is backed by Saasform [3]. This is more like a classic node/express (nestjs) application, but I really like how we're separating concerns: the SaaS = MultiPreview handles the biz logic / Saasform handles landing page + auth + payments.

    While building the new landing page I played with and liked a lot Bulma [4], I used but didn't like AlpineJS [5] and I'm thinking to move to Hotwire [6].

    My personal experience is that performance only matters when you're big enough, so in the near future I want to experiment more on usability / nocode side. And I'd love to see more open source alternatives to the big ones.

    [1] https://hasgluten.com

    [2] https://multipreview.com

    [3] https://github.com/saasform/saasform

    [4] https://bulma.io

    [5] https://github.com/alpinejs/alpine

    [6] https://hotwire.dev

  • SvelteKit

    web development, streamlined (by sveltejs)

    SvelteKit, Serverless, Backendless.com

    SvelteKit[1] is a framework for SvelteJS (like Next.js is a framework for ReactJS). I've tried both Svelte and React. Svelte seems to be more elegant and lets me implement my ideas faster with less code. Svelte is very flexible; SvelteKit adds some opinions on how to do things like routing.

    SvelteKit also embraces the serverless paradigm[2] (AKA JAMstack[3]). Although a node.js server is still an option, you can also have pages rendered in serverless functions or pre-rendered at build time. Even static pages can be "hydrated" on the client so they are not totally static. So this results in fine-grained SSR (server-side rendering) at the page level. The two main reasons for SSR are performance (especially on mobile devices) and SEO.

    Backendless[4] is a VADP/MBaaS. This platform offers a lot of services, but the main one I'm looking at is authentication/identity. I was looking for an authentication service that supports anonymous guest login, social login, as well as traditional email/password login. The other contenders were Google Firebase (slow, and confusing sign in/sign up flow[5]) and AWS Cognito (too complicated/difficult to use). Auth0 was a contender, but they don't support guest logins.

    [1]: https://kit.svelte.dev

    [2]: https://www.serverless.com

    [3]: https://jamstack.org

    [4]: https://backendless.com

    [5]: https://github.com/firebase/firebaseui-web/issues/665

  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • gomodest

    A complex SAAS starter kit using Go, the html/template package, and sprinkles of javascript.

  • htmx

    </> htmx - high power tools for HTML

    I am working on two alternative tools for building web site:

    https://htmx.org - uses HTML attributes and HTML-over-the-wire for AJAX/Web Socket/SSE interactions

    https://hyperscript.org - an experimental front end programming language derived from HyperTalk that is event-oriented and that removes the distinction between synchronous and asynchronous code.

  • koyo

    A web development toolkit for Racket.

  • re-web

    Experimental web framework for ReasonML & OCaml

  • pratik.is

    I'm really enjoying working with MDX (JSX & markdown hybrid). https://mdxjs.com/

    I was able to quickly put together a blog with some pretty nice features (e.g. margin notes): https://pratik.is/writing/essays/media-as-food

    Writing content in markdown and enhancing interactivity with JSX is amazing.

    If you click "Raw" here you can see how the blog post is just markdown with some custom JSX elements littered in, e.g. : https://github.com/pringshia/pratik.is/blob/master/pages/wri...

  • Klotho

    AWS Cloud-aware infrastructure-from-code toolbox [NEW]. Build cloud backends with Infrastructure-from-Code (IfC), a revolutionary technique for generating and updating cloud infrastructure. Try IfC with AWS and Klotho now (Now open-source)

  • mdx

    Markdown for the component era

    I'm really enjoying working with MDX (JSX & markdown hybrid). https://mdxjs.com/

    I was able to quickly put together a blog with some pretty nice features (e.g. margin notes): https://pratik.is/writing/essays/media-as-food

    Writing content in markdown and enhancing interactivity with JSX is amazing.

    If you click "Raw" here you can see how the blog post is just markdown with some custom JSX elements littered in, e.g. : https://github.com/pringshia/pratik.is/blob/master/pages/wri...

  • firebaseui-web

    FirebaseUI is an open-source JavaScript library for Web that provides simple, customizable UI bindings on top of Firebase SDKs to eliminate boilerplate code and promote best practices.

    SvelteKit, Serverless, Backendless.com

    SvelteKit[1] is a framework for SvelteJS (like Next.js is a framework for ReactJS). I've tried both Svelte and React. Svelte seems to be more elegant and lets me implement my ideas faster with less code. Svelte is very flexible; SvelteKit adds some opinions on how to do things like routing.

    SvelteKit also embraces the serverless paradigm[2] (AKA JAMstack[3]). Although a node.js server is still an option, you can also have pages rendered in serverless functions or pre-rendered at build time. Even static pages can be "hydrated" on the client so they are not totally static. So this results in fine-grained SSR (server-side rendering) at the page level. The two main reasons for SSR are performance (especially on mobile devices) and SEO.

    Backendless[4] is a VADP/MBaaS. This platform offers a lot of services, but the main one I'm looking at is authentication/identity. I was looking for an authentication service that supports anonymous guest login, social login, as well as traditional email/password login. The other contenders were Google Firebase (slow, and confusing sign in/sign up flow[5]) and AWS Cognito (too complicated/difficult to use). Auth0 was a contender, but they don't support guest logins.

    [1]: https://kit.svelte.dev

    [2]: https://www.serverless.com

    [3]: https://jamstack.org

    [4]: https://backendless.com

    [5]: https://github.com/firebase/firebaseui-web/issues/665

  • serverless-graphql

    Serverless GraphQL Examples for AWS AppSync and Apollo

    SvelteKit, Serverless, Backendless.com

    SvelteKit[1] is a framework for SvelteJS (like Next.js is a framework for ReactJS). I've tried both Svelte and React. Svelte seems to be more elegant and lets me implement my ideas faster with less code. Svelte is very flexible; SvelteKit adds some opinions on how to do things like routing.

    SvelteKit also embraces the serverless paradigm[2] (AKA JAMstack[3]). Although a node.js server is still an option, you can also have pages rendered in serverless functions or pre-rendered at build time. Even static pages can be "hydrated" on the client so they are not totally static. So this results in fine-grained SSR (server-side rendering) at the page level. The two main reasons for SSR are performance (especially on mobile devices) and SEO.

    Backendless[4] is a VADP/MBaaS. This platform offers a lot of services, but the main one I'm looking at is authentication/identity. I was looking for an authentication service that supports anonymous guest login, social login, as well as traditional email/password login. The other contenders were Google Firebase (slow, and confusing sign in/sign up flow[5]) and AWS Cognito (too complicated/difficult to use). Auth0 was a contender, but they don't support guest logins.

    [1]: https://kit.svelte.dev

    [2]: https://www.serverless.com

    [3]: https://jamstack.org

    [4]: https://backendless.com

    [5]: https://github.com/firebase/firebaseui-web/issues/665

  • ecstatic

    A Javascript ECS library worth getting excited about

    I've been experimenting with ways of using Web Components with the ECS (Entity Component System) pattern. I'm not sure it will ever become the preferred way of writing web apps, but it does offer promise in exposing some alternate ways to structure Frontend code.

    Here is an example Calculator App I've made: https://codesandbox.io/s/fervent-elion-isq29

    And here is the ECS library I'm using (which I've written): https://github.com/brochington/ecstatic

  • rescript-compiler

    The compiler for ReScript.

    https://rescript-lang.org/

    Based on ocaml’s type system which is a delight to use.

    I’ve been working on this codebase for over a year and I’ve yet to see a runtime error. Maybe there was one minor one, not sure. It’s remarkable.

  • tamagui

    Universal UI kit and style system for React Native + Web - with an optimizing compiler 🚄

    Cannot recommend gqless highly enough for making graphql actually fun to use and closer to something like meteor/firebase syntax[0].

    And I’ll self-promote, but I’ve been working on what I consider to be a “next generation” style system for React that solves my biggest issue with it currently: being able to performantly write styles in a nice syntax that optimize for both web and native. Called SnackUI, though it’s still in beta[1].

    [0] https://gqless.com

    [1] https://github.com/snackui/snackui

  • gqless

    a GraphQL client without queries

    Cannot recommend gqless highly enough for making graphql actually fun to use and closer to something like meteor/firebase syntax[0].

    And I’ll self-promote, but I’ve been working on what I consider to be a “next generation” style system for React that solves my biggest issue with it currently: being able to performantly write styles in a nice syntax that optimize for both web and native. Called SnackUI, though it’s still in beta[1].

    [0] https://gqless.com

    [1] https://github.com/snackui/snackui

  • mongoose-json-patch

    A utility for applying RFC6902 JSONPatch operations to mongoose models

  • json-patch-rules

    Tools and specification for defining rules about how a json patch should be applied to an object

  • saasform

    Add signup & payments to your SaaS in minutes.

    Fav thread ever!

    A good 5+ years ago I built HasGluten [1] with react backed by a google spreadsheet, hosted on github pages. Proven technology, it's still working.

    More recently I hacked together MultiPreview [2] with react + API served by firebase functions. I'm also temp using firebase hosting as I have little traffic, but plan to replace it with edge computing / CDN caching.

    MultiPreview is backed by Saasform [3]. This is more like a classic node/express (nestjs) application, but I really like how we're separating concerns: the SaaS = MultiPreview handles the biz logic / Saasform handles landing page + auth + payments.

    While building the new landing page I played with and liked a lot Bulma [4], I used but didn't like AlpineJS [5] and I'm thinking to move to Hotwire [6].

    My personal experience is that performance only matters when you're big enough, so in the near future I want to experiment more on usability / nocode side. And I'd love to see more open source alternatives to the big ones.

    [1] https://hasgluten.com

    [2] https://multipreview.com

    [3] https://github.com/saasform/saasform

    [4] https://bulma.io

    [5] https://github.com/alpinejs/alpine

    [6] https://hotwire.dev

  • Bulma

    Modern CSS framework based on Flexbox

    Fav thread ever!

    A good 5+ years ago I built HasGluten [1] with react backed by a google spreadsheet, hosted on github pages. Proven technology, it's still working.

    More recently I hacked together MultiPreview [2] with react + API served by firebase functions. I'm also temp using firebase hosting as I have little traffic, but plan to replace it with edge computing / CDN caching.

    MultiPreview is backed by Saasform [3]. This is more like a classic node/express (nestjs) application, but I really like how we're separating concerns: the SaaS = MultiPreview handles the biz logic / Saasform handles landing page + auth + payments.

    While building the new landing page I played with and liked a lot Bulma [4], I used but didn't like AlpineJS [5] and I'm thinking to move to Hotwire [6].

    My personal experience is that performance only matters when you're big enough, so in the near future I want to experiment more on usability / nocode side. And I'd love to see more open source alternatives to the big ones.

    [1] https://hasgluten.com

    [2] https://multipreview.com

    [3] https://github.com/saasform/saasform

    [4] https://bulma.io

    [5] https://github.com/alpinejs/alpine

    [6] https://hotwire.dev

  • Alpine.js

    A rugged, minimal framework for composing JavaScript behavior in your markup.

    Fav thread ever!

    A good 5+ years ago I built HasGluten [1] with react backed by a google spreadsheet, hosted on github pages. Proven technology, it's still working.

    More recently I hacked together MultiPreview [2] with react + API served by firebase functions. I'm also temp using firebase hosting as I have little traffic, but plan to replace it with edge computing / CDN caching.

    MultiPreview is backed by Saasform [3]. This is more like a classic node/express (nestjs) application, but I really like how we're separating concerns: the SaaS = MultiPreview handles the biz logic / Saasform handles landing page + auth + payments.

    While building the new landing page I played with and liked a lot Bulma [4], I used but didn't like AlpineJS [5] and I'm thinking to move to Hotwire [6].

    My personal experience is that performance only matters when you're big enough, so in the near future I want to experiment more on usability / nocode side. And I'd love to see more open source alternatives to the big ones.

    [1] https://hasgluten.com

    [2] https://multipreview.com

    [3] https://github.com/saasform/saasform

    [4] https://bulma.io

    [5] https://github.com/alpinejs/alpine

    [6] https://hotwire.dev

  • headlessui

    Completely unstyled, fully accessible UI components, designed to integrate beautifully with Tailwind CSS.

    - tailwindcss

    I moved a React side-project from CRA to Next.js for server-side rendering benefits, but the latter doesn't support directly importing css styles in jsx to avoid problems with the global scope.

    The two options offered were CSS modules and CSS-in-JS. I didn't like either approaches having hashes in the classname when opening the website in devtools, and both seemed too locked into React/JSX.

    Tailwind 1. doesn't have component framework lock-in 2. doesn't make me think of css classnames 3. atomic classnames are readable in dev tools 4. provides default colors and box shadows, etc.

    In addition, they're starting to make a render-less component library (https://headlessui.dev/): that means you can customize how components look without having to understand how its javascript internals work, which I'd find a huge plus compared to other libraries like ant design or material-ui.

    - vite + react

    More beginner friendly than webpack in starting a new project, and faster developer experience: page reloads almost instantly when you're modifying a component.

  • Tailwind CSS

    A utility-first CSS framework for rapid UI development.

  • aws-lambda-java-libs

    Official mirror for interface definitions and helper classes for Java code running on the AWS Lambda platform.

  • yazz

    Self Service Apps Without the IT Department

    I'm using a tool I built myself for simple internal apps: https://github.com/yazz/visualjavascript

  • ra-data-hasura

    react-admin data provider for Hasura GraphQL Engine

    Elm + elm-ui[1] (dont worry about CSS so much) + generated Elm client lib from GraphQL schema + Hasura (GraphQL over Postgres) + Postgres => strong type safety from db schema to frontend; possibly add ReactAdmin[2] to the mix if that sort of thing is needed.

    Rust + Actix + Yew (Rust browser framework compiling to WASM) => also verrrry nice!

    Slightly more traditional: Kotlin and jOOQ.

    [1]: https://www.youtube.com/watch?v=Ie-gqwSHQr0

    [2]: https://github.com/hasura/ra-data-hasura

  • singyeong

    신경 - Cloud-native messaging/pubsub with powerful routing

    For my projects I've built most of the infrastructure stack myself:

    - https://github.com/queer/singyeong if I need message queuing / etc

  • crush

    A time-traveling distributed key-value store (by queer)

  • mahou

    魔法 - Mahō is a highly-opinionated yet quite magical research project into microservice-oriented application infrastructure. (by queer)

    - https://github.com/queer/mahou is my WIP to replace container schedulers

    It's a very satisfying experience to see my own tooling reach this level of maturity ^^

  • girouette

    Grammar-based, generative approach to CSS.

    I seldom write CSS. I tried tailwindcss on one of my recent projects that required to closely follow a custom design (a portfolio for a graphic designer friend). I like it, with some caveats.

    Main benefit for me is that I don't need to remember how to write css. 95% of what I need is a shortcut away from tailwind docs. The result is "prettier" than any other website-from-scratch I've done (that's purely on me, not much css practice). Now that I've memorised most common tailwind classes, I'm also moving faster than with pure css.

    Main downside is that it's annoying having to modify tailwind's config file to add non-default variations (mostly different heights/widths than what it ships with).

    Maybe something like Girouette[0] would be better.

    [0] https://github.com/green-coder/girouette

  • tailwindcss-jit

    > add non-default variations (mostly different heights/widths than what it ships with).

    Check out https://github.com/tailwindlabs/tailwindcss-jit. It got released 3 weeks ago, and supports variable variables in width and height now.

  • Quasar Framework

    Quasar Framework - Build high-performance VueJS user interfaces in record time

    This is slightly unrelated but I looked up Quasar and their homepage (https://quasar.dev/) is the first website that literally makes me nauseous just by looking at it.

    That's a kind of UX problem I didn't even consider to exist a few minutes ago.

  • gomodest-template

    A template to build dynamic web apps quickly using Go, html/template and javascript

    I have built an app template which uses Go html/template package to render html on the server. The app is enhanced using sprinkles of javascript(stimulusjs, svelte single file components) on the client, wherever needed.

    1. template: https://github.com/adnaan/gomodest-template

  • CoilSnake

    Some recent projects:

    - Frontend only, plain javascript, but a lot of it uses a project-specific custom scripting language. This is a game that consists almost entirely of procedurally generated written content, so I write a language that makes it easy to categorize procedural content bits and make sub-calls to new ones. I have a long way to go on language design still, but it's already better than a json blob.

    - HTML frontend with some small plain javascript. Backend is node/express, but most of the heavy lifting is done by a shell call to Coil Snake[1], and which inserts a ton of code in ccscript and 65816 assembly. This is a randomizer for Earthbound (http://pkscramble.com/), so those are super specialized tools for that purpose. But I really like the Coil Snake ecosystem, and it's definitely going to influence my projects going forward (the decision to use a custom scripting language above was influenced by ccscript).

    - Plain javascript frontend, vertx backend, postgres database. This is my goto for serious projects. It's fairly boring.

    [1]https://github.com/pk-hack/CoilSnake

  • amgr_phx

    - Automated deployments with Gigalixir

    I switched to gatsby and I notice that I was spending more time fighting the system than writing.

    You can check it out here: https://allanmacgregor.com/posts and the code is available here: https://github.com/amacgregor/amgr_phx

  • makesite

    Simple, lightweight, and magic-free static site/blog generator for Python coders

  • sci

    Configurable Clojure/Script interpreter suitable for scripting and Clojure DSLs

    My blog/homepage is built using:

    - Gatsby.js static site generator framework

    - Posts written as md or mdx (markdown with jsx support)

    - Github Actions to build the site

    - Published to and served by Cloudflare workers

    - Uses [sci](https://github.com/borkdude/sci) and ClojureScript to add a live Clojure REPL component that can be used in blog posts

    - Tailwindcss is used for styling via emotion css-in-js and a tailwind plugin.

    The setup mostly works ok, but as always with the JavaScript community the amount of breaking changes can be a bit taxing. Because Gatsby handles static site generation the blog works without JavaScript enabled for those that only want to access the static content.

  • DataRecovery

    Website for a DataRecovery Business build using Spring Boot, Kotlin, Angular. Deployed with Docker Compose and Github Actions

    I'm doing Fullstack with Angular + Spring Boot Kotlin.

    I love writing the backend but the frontend part really seems overly complex.

    In the end I'm just mirroring my data from the backend on the frontend, having to maintain two models, mapping the json to an object and then inputing that data into another component where it gets displayed. For example I tried to create a generic edit component but without reflexion it was a huge pain in the butt: https://github.com/tschuehly/DataRecovery/blob/f4003ddebbba7...

    I would love to just have an html structure and then just having a template for a component filling it in the backend and sending it to the frontend.

  • tailwindcss-typography

  • hyperhyperspace-react

    React bindings for using Hyper Hyper Space objects as state in React apps.

  • datasette.io

    The official project website for Datasette

  • datasette

    An open source multi-tool for exploring and publishing data

  • til

    Today I Learned (by simonw)

  • museums

    A website recommending niche museums to visit

  • openapi-generator

    OpenAPI Generator allows generation of API client libraries (SDK generation), server stubs, documentation and configuration automatically given an OpenAPI Spec (v2, v3)

  • docsify

    🃏 A magical documentation site generator.

  • Papercups

    Open-source live customer chat

    Phoneix - Elixir

    We're a live message tool and it is basically what Elixir is built for https://github.com/papercups-io/papercups.

    The Elixir community has been great and incredibly friendly. I originally was worried about the size of the community but that hasn't been an issue the community has been super helpful. I also think the annual stackoverflow usage surveys are very misleading because most of the community's questions get asked in ElixirForum and not on Stackoverflow.

    Phoneix is the web framework of Elixir which is very similar to Rails but minus a lot of the magic has been very helpful for our productivity as well.

    If I had to built another service that is websocket heavy I would definitely use Elixir. Even if it was a standard crud app I would still most likely choose Elixir.

  • Svelte

    Cybernetically enhanced web apps

    I'm using SvelteJS[1] (specifically, Sapper[2]) on my product ListenAddict[3].

    On other products I'm using SvelteKit[4], which is the spiritual successor to Sapper, but it's _very much_ in beta, and I wouldn't quite recommend it for production yet (even though it is being used in production for the NY Times).

    I've found Svelte to be amazing to work in, especially compared to React/Vue/Angular. The compiler is great, and the final size in production is fantastic. It's also super easy to do things that I previously found annoying/hard/long-winded to do in React.

    [1] https://svelte.dev/

  • Sapper

    The next small thing in web development, powered by Svelte

  • sanic

    Next generation Python web server/framework | Build fast. Run fast.

  • ructe

    Rust Compiled Templates with static-file handling

  • Sonar

    Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.

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