Awesome projects under 1000 stars (3) - Lyo
Tags: javascript, github, opensource
Published: 2018-11-07 10:42:15

---
title: Awesome projects under 1000 stars (3) - Lyo
published: true
description: Every month, discover an awesome under-appreciated web project.
cover_image: https://thepracticaldev.s3.amazonaws.com/i/qp4b737pvxuyyzvfpmjh.jpg
series: awesome-project-under-1000-stars
tags: javascript, github, opensource
---

# [Lyo](https://github.com/bokub/lyo)

One of the most appreciated feature of the Javascript environment is undoubtedly the [NPM](https://www.npmjs.com) huge choice of open-source packages. Easy to use, (mostly) reliable, fast, secure ... it has many big advantages under its belt.

On the other hand, one of the most hated subject, even by veteran developer is the weird dichotomy between node.js and javascript browser engines. The language offer the possibility to run the same code on back-end and front-end, but we never quite got where it works seamlessly.

![Lyo](https://user-images.githubusercontent.com/17952318/44954822-2055cc80-aea9-11e8-9ebd-b10619f80171.png)

Lyo aim to fill that gap. This tool could turn any node.js package into a single file browser library.
Let's walk through an example to see it running.

First, I choose a random package on NPM that I want to have on my browser. A common feature missing from Javascript is native encryption, so I choose [sha1](https://www.npmjs.com/package/sha1). Imagine I want to add this hashing script to a plain HTML page.

Since [npx](https://www.npmjs.com/package/npx) exists, I don't even have to install Lyo, I can just run:
```sh
npx lyo get sha1
```

![Lyo result](https://thepracticaldev.s3.amazonaws.com/i/3o3knp6z45jbsx675d9j.png)

From top to bottom, we can see that :
 - Lyo was installed in 6.5s
 - run over sha1 version 1.1.1
 - it read the file sha1.js
 - output a file named sha1.min.js
 - named the library `sha1`
 - Browserify, Babel and Uglify was successfully ran
 - Lyo terminated without error

Then, I can simply add the output file into my HTML page.

```html
<script src="sha1.min.js"></script>
<script>
console.log(sha1("P@ssWord")); // => 56355fa0c17cb7f9dc0d936f6c7aa385114ee097
</script>
```

How easy is this !

Not easy enough ? You don't even want to open your terminal ? Lyo got you covered. Open [lyo.now.sh](https://lyo.now.sh/) on your favorite browser and enter the name of the package you want to compile. Lyo will take care of everything and output how you can use this package over a CDN or node.js.

[![Lyo service](https://thepracticaldev.s3.amazonaws.com/i/27zhmnkeat6xi9qb1a69.png)](https://lyo.now.sh/sha1)

On the other side of the spectrum, why not provide your user with a browser version of your node.js package ?
Of course, you might already use Browserify or Webpack, but you can now delegate all the work to Lyo.

Open your project folder, then run:
```
npx lyo init
npm install
```

Lyo will edit the `package.json` file to add itself as a dependency and add a script to execute it.
Now, every time you publish your work on NPM, it will be packed in a single file. This file can then be directly downloaded or through a CDN like [jsDelivr](https://www.jsdelivr.com/) or [unpkg](https://unpkg.com/#/).

A few caveat, Lyo can't ensure that its output is working under the browser environment. For example, a package using the file system or any node-only capability, won't be able to run on a browser. Also, Browserify is quite opinionated on the use of ES6 features like [import/export](https://github.com/browserify/browserify/issues/1186). It means you can't use any syntax not already supported by the node.js' last version.

I really love how a so complex process can be used so easily. Whether you like or not the [extreme modularity of NPM](https://www.npmjs.com/package/is-even), Lyo allow you to harness this power.


See you all next month.