npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

nikki

v0.28.1

Published

A browser-based IDE written in NodeJS. For Real.

Downloads

75

Readme

Nikki

A fast, browser-based IDE written in NodeJS. For Real.

Nikki's philosophy embraces the "less is better" approach, giving you a smart text editor that lets you focus on code rather than making you waste your time waiting for the IDE to boot, to suggest a method or to scan a new project.

Nikki is purely built on JavaScript (both on the browser and on Node), HTML and CSS, uses socket.io to have fun with your filesystem and the ACE editor to let you edit files like you're on your (ex) favourite IDE.

Installation

The recommended way to install nikki is to do it globally:

npm install -g nikki

Usage

ScreenShot

Once you have it installed globally you can simply start nikki from the command line:

nikki

This command will open your browser at http://localhost:9123/, where the IDE is running.

To open specific project, simply specify it in the URL, for example http://localhost:9123/home/odino/my-project.

You can check whether nikki is runnin with a nikki --status; if you want to stop nikki simply run nikki --stop.

If you wish to start nikki on another port, simply specify it once you start the IDE:

nikki --port 8000

By default, nikki opens on the directory from which it was launched, which means that:

cd /tmp

nikki

will open the browser at http://localhost:9123/tmp

If you feel lost, simply run a nikki --help and get some comfort; in any case, upon booting, you will find a nikki.log file in nikki's root directory: in case of errors, have a look there.

Configuration

By default, nikki comes with some configs stored in the .nikki.yml file of the module itself; you can setup custom configs by storing a .nikki.yml file in your home directory, or in the directory from which you are starting nikki.

For example, to change the editor theme, you can create the .nikki.yml configuration file in ~:

editor:
  theme: chaos

For a full list of available configurations, have a look here.

If you want to be more granular and specify per-project configurations, you can do it by storing another .nikki.yml in your project's folder (ie. /home/user/projects/test-project/.nikki.yml): once you open nikki at localhost:9123/home/user/projects/test-project you will see that you are now using custom configurations that will only be available on that project.

Shortcuts

Nikki is thought with shortcuts in mind and focused on letting you write code without using your mouse.

Here are some of the shortcuts you might find useful while using it (on Macs, simply replace ctrl with ):

  • use up or down to move between files / directories
  • press space to open a file / directory
  • ctrl + s will save the current open file
  • ctrl + f to find a string in the current file
  • ctrl + shift + f will search for files and directories
  • ctrl + shift + g will search in files
  • press ctrl + shift + x to switch the focus between the filesystem structure and the editor tab (this is handy when you open a file, save it and then wanna open another file without using the mouse)
  • press delete to delete either a file or a directory

When you are on the editor tab, use your usual shortcuts (ie. tab to indent, ctrl + z to undo), as we are using the ACE editor.

To switch between editor tabs, press ctrl + < and ctrl + >; to close a tab simply use ctrl + shift + l.

For a full list of keyboard shortcuts supported by the editor visit its documentation.

File / directory search

When the search is enabled (ctrl + shift + f), you can use a single word or a sequence of words to match a path; long story short:

  • app matches app.js and app_production.js
  • app prod only matches app_production.js
  • proj app matches /some/path/project/app.js

Nikki will look for files from the current directory onwards.

Support

Nikki should work on all modern browser: for an optimal experience, though, we recommend the latest versions of Chrome and Firefox.

Development

You can contribute to nikki by simply forking this repo and running it locally; cd into nikki's root, run npm install and launch the app with gulp:

git clone [email protected]:odino/nikki.git

cd nikki

npm install

gulp

By the way, the layout sucks, big time: never been a genious with HTML and CSS so if you guys wanna come up with something I'd be super happy.

License

For the ones who care, nikki is released under the MIT license.

Are you for real?

"Kinda", "Why not?" and "Let's just have fun" are all valid answers to this question.

Of course, calling this thing an "IDE" is a bit - well, a lot - pretentious. On purpose ;-)

The main idea behind nikki came up to my mind months ago when I was thinking on why we are still relying on desktop applications to interact with the filesystem while we can simply use sockets to make the browser communicate, in a simple way, with the server. At the same time, I got so much frustrated with traditional IDEs like Eclipse, Netbeans, WebStorm: tried all of them and it's just ridicolous how much time you spend in waiting for that thing to respond to your actions.

Hey, couldn't you simply use TextMate or LightTable?

Yes, but then, where's the fun?

Bonus

The sickest thing is that I started building Nikki with WebStorm and, once it got quite decent, I continued to build Nikki with Nikki.