DEV Community

Cover image for Writing Modern Web Applications In Nim
Ethosa
Ethosa

Posted on

Writing Modern Web Applications In Nim

Nim has two famous web frameworks for frontend and backend development - Jester and Karax, but this post not about them.

This post about HappyX web framework.

In HappyX a lot of things runs at compile-time due to metaprogramming (macro-oriented). It's mean that your web application will be faster than more other apps created in other web frameworks.

In HappyX you can write both server-side and client-side applications with the same code. This allows developers spend less time to development.

Here also a LOT of syntax sugar due to DSL (Domain-specific language), ex:

# Server-side application example
import happyx


# declare server at http://127.0.0.1:5000
serve "127.0.0.1", 5000:
  # Will match /user/id100, /user/id0, /user/id25, etc.
  # Don't match /user/idSomeId
  get "/user/id$id:int":
    # Respond JSON
    # `id` is immutable variable
    return {"response": fmt"Hello, user[{id}]"}

  # Will match /post/c0ffe, /post/babe, /post/cafe, etc.
  # Don't match /post/SomeId
  get "/post/$postId:/[a-fA-F0-9]+/":
    # Respond JSON
    # `postId` is immutable variable
    return {"response": postId}
Enter fullscreen mode Exit fullscreen mode

There are also CLI for creating, building and serving your projects!

hpx create --name my_project --kind SPA --use-tailwind
cd my_project
hpx build
hpx dev --reload
Enter fullscreen mode Exit fullscreen mode

You can also convert HTML files into HappyX files with html2tag command:

hpx html2tag source.html --output output
Enter fullscreen mode Exit fullscreen mode

Frontend Example

import happyx

# Declare our application and set target element with id="app"
appRoutes "app":
  # Will be at example.com/#/home
  "/home":
    tDiv(class = "someClass"):  # equal to <div class="someClass">
      "Hello, world!"  # equal to Hello, world!
Enter fullscreen mode Exit fullscreen mode

Backend Example

import happyx

# Declare our application
serve "127.0.0.1", 5000:
  # will be at http://127.0.0.1:5000/
  get "/":
    # plain/text
    return "Hello, world!
Enter fullscreen mode Exit fullscreen mode

Top comments (0)