Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

nuejs-core

Package Overview
Dependencies
Maintainers
1
Versions
12
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

nuejs-core

  • 0.1.2
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
20
decreased by-41.18%
Maintainers
1
Weekly downloads
 
Created
Source
Nue logo

DocumentationExamplesGetting started Rethinking reactivity

What is Nue JS?

Nue JS is an exceptionally small (2.3kb minzipped) JavaScript library for building web interfaces. It is the core of the upcoming Nue toolset. It’s like Vue.js, React.js, or Svelte but there are no hooks, effects, props, portals, watchers, provides, injects, suspension, or other unusual abstractions on your way. Learn the basics of HTML, CSS, and JavaScript and you are good to go.

Build user interfaces with cleaner code

With Nue your UI code is cleaner and usually smaller:

The difference in coding style

It's not unusual to see 2x-10x differences in the amount of code you need to write.

"It's just HTML"

Nue uses an HTML-based template syntax:

<div class="{ type }">
  <img src="{ img }">
  <aside>
    <h3>{ title }</h3>
    <p :if="desc">{ desc }</p>
    <slot/>
  </aside>
</div>

While React and JSX claim to be "Just JavaScript", Nue can be thought of as "Just HTML". Nue is perfect for UX developers focusing on interaction design, accessibility, and user experience.

Built to scale

Three reasons why Nue scales extremely well:

  1. Minimalism, a hundred lines of code is easier to scale than a thousand lines of code

  2. Separation of concerns, easy-to-understand code is easier to scale than "spaghetti code"

  3. Separation of talent, when UX developers focus on the front of the frontend and JS/TS developers focus on the back of the frontend your team skills are optimally aligned:

The best results are gained when UX developers and JavaScript developers work together without overlaps

Reactive, hybrid, and isomorphic

Nue has a rich component model and it allows you to create all kinds of applications using different kinds of components:

  1. Server components are rendered on the server. They help you build content-focused websites that load faster without JavaScript and are crawled by search engines.

  2. Reactive components are rendered on the client. They help you build dynamic islands or single-page applications.

  3. Hybrid components are partly rendered on the server side, and partly on the client side. These components help you build reactive, SEO-friendly components like video tags or image galleries.

  4. Universal components are used identically on both server- and client side.

UI library files

Nue allows you to define multiple components on a single file. This is a great way to group related components together and simplify dependency management.

<!-- shared variables and methods -->
<script>
  import { someMethod } from './util.js'
</script>

<!-- first component -->
<article @name="todo">
  ...
</article>

<!-- second component -->
<div @name="todo-item">
  ...
</div>

<!-- third component -->
<time @name="cute-date">
  ...
</time>

With library files, your filesystem hierarchy looks cleaner and you need less boilerplate code to tie connected pieces together. They help in packaging libraries for others.

Simpler tooling

Nue JS comes with a simple render function for server-side rendering and a compile function to generate components for the browser. There is no need for toolchains like Webpack or Vite to hijack your natural workflow. Just import Nue to your project and you are good to go.

You can of course use a bundler on the business model if your application becomes more complex with tons of dependencies. Bun and esbuild are great options.

Use cases

Nue JS is a versatile tool that supports both server- and client-side rendering and helps you build both content-focused websites and reactive single-page applications.

  1. UI library development Create reusable components for reactive frontends or server-generated content.

  2. Progressive enhancement Nue JS is a perfect micro library to enhance your content-focused website with dynamic components or "islands"

  3. Static website generators Just import it into your project and you are ready to render. No bundlers are needed.

  4. Single-page applications Build simpler and more scalable apps together with an upcoming Nue MVC- project.

  5. Templating Nue is a generic tool to generate your websites and HTML emails.

FAQs

Package last updated on 30 Oct 2023

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc