How to make your own programming language in JavaScript

This page summarizes the projects mentioned and recommended in the original post on dev.to

Our great sponsors
  • SurveyJS - Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App
  • InfluxDB - Power Real-Time Data Analytics at Scale
  • WorkOS - The modern identity platform for B2B SaaS
  • gaiman

    Gaiman: Text based game engine and programming language

  • I've wanted to have my own programming language, that will make it easier to create text-based adventure games for my Open Source project jQuery Terminal. The idea for the language came after I've created a paid gig for one person, let's call him Ken, that needed this type of game, where the user interacted with the terminal and was asked a bunch of questions and it was like an adventure game, related to Crypo. The code I've written, that Ken needed, was data-driven by a JSON file. It was working nicely, Ken could easily change the JSON and have the game changed however he wanted. I've asked if I could share the code since it was a very cool project and Ken agreed that I can do that two months after he publish the game. But after a while, I've realized that I can have something much better. My own DSL language, that will make it simpler to create text-based adventure games. A person with a bit of programming knowledge like Ken, could easily edit the game, because the language will be much simpler than complex JavaScript code that is needed for something like this. And even if I would be asked to create a game like the one for Ken, it would be much easier and faster for me. This is how Gaiman programming language has started.

  • escodegen

    ECMAScript code generator

  • What's cool about Esprima syntax is that there are tools that generate code based on their AST. An example is escodegen which takes Esprima AST as input and outputs JavaScript code. You can think that you can use just strings to generate code, but this solution will not scale. In this tutorial, I show only a single if statement but you will run into a lot of problems if you will have more complex code.

  • SurveyJS

    Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

    SurveyJS logo
  • jquery.terminal

    jQuery Terminal Emulator - JavaScript library for creating web-based terminals with custom commands

  • I've wanted to have my own programming language, that will make it easier to create text-based adventure games for my Open Source project jQuery Terminal. The idea for the language came after I've created a paid gig for one person, let's call him Ken, that needed this type of game, where the user interacted with the terminal and was asked a bunch of questions and it was like an adventure game, related to Crypo. The code I've written, that Ken needed, was data-driven by a JSON file. It was working nicely, Ken could easily change the JSON and have the game changed however he wanted. I've asked if I could share the code since it was a very cool project and Ken agreed that I can do that two months after he publish the game. But after a while, I've realized that I can have something much better. My own DSL language, that will make it simpler to create text-based adventure games. A person with a bit of programming knowledge like Ken, could easily edit the game, because the language will be much simpler than complex JavaScript code that is needed for something like this. And even if I would be asked to create a game like the one for Ken, it would be much easier and faster for me. This is how Gaiman programming language has started.

  • peggy

    Peggy: Parser generator for JavaScript

  • NOTE: The original PEG.js project is not maintained anymore, but there is a new fork, Peggy that is maintained and it's backward compatible with PEG.js so it will be easy to switch.

  • esprima

    ECMAScript parsing infrastructure for multipurpose analysis

  • AST is an acronym for Abstract Syntax Tree. It's the way to represent code in a format that tools can understand. Usually in form of tree data structure. We will use AST in the format of an Esprima, which is a JavaScript parser that outputs AST.

  • astexplorer

    A web tool to explore the ASTs generated by various parsers.

  • But what we need is not to interpret the code and return a single value but return Esprima AST. To see how Esprima AST looks like you can check AST Explorer select Esprima as output and type some JavaScript.

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a more popular project.

Suggest a related project

Related posts