J

JsBook-Neo

JsBook-Neo is like Jupyter for Javascript where you can write your code in parts and document it as well. It has support for npm package where you can import any package such as React, bulma and etc.

18
J

JsBook-Neo

JsBook-Neo is like Jupyter for Javascript where you can write your code in parts and document it as well. It has support for npm package where you can import any package such as React, bulma and etc.

The problem JsBook-Neo solves

  • No additional setup needed to start writing your JavaScript code.
  • Support for React and many similar framework is included. Just import the correct npm package for the framework and JSBook will automatically download and include the imports for you 🔥.
  • Write your amazing code in open source marco editor.
  • Write documentation using built-in open source markdown editor whenever required 📝.
  • Support for numerous css libraries is also included. Try Bulma CSS, Bootstrap and any other. Just import the css link (such as import "[email protected]/css/bulma.min.css") and you are good to go.
  • Download your JSBook json file and share it with your fellow developers. The recieving person just needs to upload the json file to JSBook.
  • NeoBrutalism design pattern. Hence the name JSBook NEO 😁.
  • Dark Mode included.
  • It's ALL OPEN SOURCE. Find the source code on GitHub.

Challenges I ran into

Initially the problem was "where to compile the code?".

Options that i had:

  • Option1: compile the code in server where user sends the request with the code in body and server responds with compiler code.
  • Option2: compile it client side in browser itself.

Each approach had it's ups and downs.

For example if i decided to go with first option, I required a place to compile code or store it. Then again i would also need a good server (maybe saas might work), but in the end it would lead to more cost if number of user increases which i clearly cannot afford. This approach might not also be quick since we keep sending requests to backend debouncing the code editor.

Hence, in order to save money and make the process of compilation quick i decided to go with option 2. User can get his/her code compiled really quick and npm packages can be cached locally. Next time user imports the same package it won't be downloaded again saving time and bandwidth.

Discussion