Mimir IDE is a great tool that can be used for nearly any type of development. In this document, we will be exploring a basic HTML/CSS/JS project setup, and how to actually see your edits and changes live, all from within the Mimir IDE space. Nothing needs to be running from your local computer other than a web browser, and all of your code lives in your workspace in the cloud, allowing you to access it from anywhere with an internet connection.

Mimir IDE works just like a normal Linux based machine, containing the same tools and file system of a real Linux system. If you aren't familiar with Linux (Ubuntu 16.04 LTS to be exact), we recommend looking at some tutorials (Basic Terminal, More Terminal) before getting started, although it isn't 100% necessary. Even if you don't know Linux, hopefully this tutorial can help you set up a basic server.

Below is what the Mimir IDE looks like when you first start it up:

This view consists of:

  1. top bar (menu)
  2. left sidebar (file tree)
  3. left content (text editor)
  4. right content (terminal)

This layout is configurable: the tabs/views in the content section can be moved to accommodate the user's preferred layout, including side by side, or 2x2 windows so you can have multiple files open or multiple terminals open.

The file tree on the left shows the contents of your workspace (also known as home directory). Files will appear here as text on a line, and directories the same, except with an arrow before them. If you click on a directory, it will expand and show the files and directories beneath it. If you click on a file, it will load in the text editor. You can also right click to see more options.

The equivalent of this in the terminal would be to type:

ls

The ls command will list the contents of the current directory.

For an example set up, we will make a new folder called 'www' and use that as our server root and serve files we create on an actual webserver. This is not required, and you can make any folder you'd like, or no folder at all if you want. Just keep in mind that wherever you run the following commands will expose the files at the directory to the internet!

For simplicity, we have built a function to start a server and serve files from the current directory that is unique to MimirIDE. This means that these instructions will only work this exact way on MimirIDE, as one of the commands is only available on MimirIDE.

Here is how we would setup a project in a folder called www, and then create a server and view it:

First we start by using mkdir to make a directory called www.

mkdir www

Then, we change our directory using cd to be in the www folder.

cd www

Once inside the www folder, we can use the terminal to make our files, or the file tree interface. if you do not see the new 'www' folder, try right clicking the file tree and refreshing. You can right click on www in the file tree and click new file to add  a file called 'index.html', or you can use the terminal to make a file:

touch index.html

Once that file is created, you should see it in the file tree. Click on it to load it in a text editor. If the text editor loads over the terminal, you can just drag the tab up to the higher set of tabs so you can see both the text editor and terminal at the same time. The tabs system works similar to a web browser.

Now  you can type some stuff into the text editor and save the file, and add whatever files and other things you want into the www directory to make a web page. For sake of example, I wrote an extremely simple HTML page.

 <html>
  <header><title>MimirIDE</title></header>
  <body>
    Hello world!
  </body>
</html>

Once you have a basic page/site set up, you can use the MimirIDE 'srv' command to make a very basic web server to serve your html/css/js files.

srv

srv is a command that will start a new server on port 80 for you that serves the files in the directory you are currently in. If you type srv and hit enter, you should see something like:

Serving HTTP on 0.0.0.0 port 80 ...

This means that the server is running. Now, you can hit the Mimir menu up in the menu bar and hit Toggle Port 80, which will open a new tab/window that contains the link to the web server. Keep in mind you may need to allow popups to have this functionality work.

Now, when you make changes to your files and save them, if you still have srv running you can just refresh the new tab/window and it will load the latest version of your files. You can exit out of that window at any time, and reload a new one using the same menu option.

To close the server, go back to the terminal and hit ctrl+c to cancel execution.

Remember that you can add whatever you'd like to that directory and page, and that it works just like a normal server.

  • index.html is the default document and loaded if you don't specify a file
  • if you have another file in that directory you want to view in the browser, go to the viewer window and add /{filename} at the end of the URL and hit enter, and that will load the filename you have given it


As always, we are almost always available for help and support, so if you have any questions or suggestions, feel free to get in touch by clicking the Intercom bubble at the bottom right of the screen!

Did this answer your question?