It is now possible to handle all your issues in GrunnaIDE. You do not need to have a separate place to keep what need to be done. This is a very easy issue handler and should be continued to be developed later on. I just needed something simple to have a place what should be done.
It’s not that much but I think it’s the basics to get started. I have some ides that I want to implement later on. One is that you can create an issue from the code and get a reference in the issue to the specific place so you can easy go to the place we know where it is a problem, or if you have a test case that fails.
This will be the list that show all the issues. At the moment I show both open and closed issues. I want to split that later on. I think I need to have a pageinator later on also.
There is a simple comment part so we can have a discussion what should be done or if there is question about the issue.
That is it for now. Next thing I’m looking to extend the editor to have a visual part to code with a visual part. Drag and drop coding. Lets see how that will go.
Today I will talk about how to get Phaser up and running in a easy way in Grunna IDE.
First you need to login on https://ide.grunna.com via a GitHub account. When you have logged in and your on your dashboard you can create a new project. You will need to create a node project and clone this git repo from Phaser ‘https://github.com/photonstorm/phaser3-project-template.git’.
This will create the project and a docker container will be created for you. In the bottom you will get the URL for access it, this will be renewed every time you login or refresh the page. In the container you also need to run on port 8080. Because it is in a container we need to change some more in the package file to get it working. Open up the package.json and locate this part.
"start": "webpack-dev-server --config webpack/base.js --open" we need to add two more parameters. It should be change to
"start": "webpack-dev-server --config webpack/base.js --open --host 0.0.0.0 --disable-host-check" and hit the CTRL-S to save the changes.
When that is done you go to the bottom and press the terminal tab and press enter once to get into it. Then you have to install all the dependency and you do that with
npm install, when that is finished you are good to go and start the server with
npm start. This will start the server and it should update every time you save so you don’t need to restart the server. You need however reload the page to get the new update.
Just get back to the Output tab and press the link to get into the game. It is that easy to get a server up and running and start coding your own game in phaser.
If you have any question or need any help just join our Discord and we will help you as good as we can.
I have finally finished the first version of the IDE. This is a big step in my mile stone. I have a functional WebIDE that is usable. At the moment I code everything in my IDE to improve it. So I can tackle the part I hate the most. So is there something I don’t like I need to fix it and then I go to the next part and repeat. At the moment I have an IDE that can load files. Highlight the code in different languages and have some code help but very limited. You can search for files but not in files and you can only have one file open at a time. All projects are linked to a docker instance and you are free to use that one. At the moment they are very open but I will probably close them down even further for modification.
The issues I finished this week was the ability to rename files and move them if you wanted.
I have also fixed a bug when I moved the creating a new projekt from a private repo to dashboard. So you should now be able to do that to and I have added the ability in backend to keep the same name on the URL when you reconnect to the IDE so you don’t need to change the name very time you lose the connection or getting back the next day. I will change to something else here so I use the docker name instead of a number.
I have made it very easy to track statistics also and have started to display some of it on the dashboard.
Now I need to set a clear goal for milestone 2 and see how I can get there. At the moment I have only tried to get something up and running and I have finished that so now I need to change focus. Maybe it will just be a small milestone with a lot of polish stuff and just make the IDE look better without much improved features.
It have been a very slow week and it feels that I haven’t been doing much at all but this week have been focused on getting the dashboard ready. I have done a very simple one and later I want to have some kind of template where you can have a good starting point for different languages. I have some thoughts to first focus on different game templates but that will be for the next face in the development. I have looked into save different statistics and that will be presented on the dashboard. It will be from how much data you have to have many times you have hit the save button. I will continue to see what I can save.
I found out the drawbacks to use a CDN. I was about to do some coding today to get the last things done with the statistics on the dashboard. Unfortunately a few libraries couldn’t get delivered so the entire site was unusable and I don’t know when I can use it again. I have on my to do list to change over to npm and build my own bundle. I think that a React/Vue framework are to big when I only have more or less one page that is the editor. But I need to rewrite the front end because that is just patch together to get something up and running to see if the back end is working. I guess I will prioritize this some higher after this problem. But then again I can write the front end code more like I want it.
That’s it for this week, Happy Coding All!
This last week feels that not much have been made. There are very few issues that have been done but on the other hand the one I work on are bigger and important to get working. I also found a problem with my setup in docker. I realized that all my containers have access to my local lan so I had to sit down and read up on docker network and iptables to prevent the containers to be able to talk to other parts in my network.
The first issue I fixed was the search for files. I see that I have to create a new issue about scrolling all the files that is being displayed and not only the first once. But I’m very pleased how it turned out. You can search for files by typing CTRL+P.
The thing I’m working on right now is a dashboard that will be the landing place for when you login and the go to place for creating and open new project. I will keep all the settings for the account here also. But at the moment I just need something to start with so I can build upon it. I have some thoughts to add the create project that will download finished template projects. But the dashboard start to look ok.
That’s all for this week. I hope to finish the first version this week that is coming if I don’t hit any big things. Happy coding all
I will try to write some every week what the progress with the IDE is and why I have taken some of the decisions. At the moment I only want to focus on a functional version that you can work in. It will have a lot of small problem that you can live with. So I focus on the bigger things. One of the critical things I fixed was the redirect if your not logged in. So you always get to the login page. Something that have bugged me a long time so feels good to finally fixed that one.
Another one that wasn’t top prio was the warning when you navigate away from a file that is modified but not saved. You just had to retype everything you done but nothing major. I now how a dialog that warns you about that. I will update the dialog with a save and continue later on, or this will be irrelevant when I start to use tabs for all the files.
Another very risky button I had was the remove project. It was removing the project without asking for confirmation. This is now fixed. Maybe I need something more so you don’t accidentally remove your project.
From the beginning I had a requirement that you needed a git repository tied to your project so you was forced to have some way to update your code. This is now dropped and you can create projects just to test something that isn’t tied to any repository.
And lastly I have finally added the change of the mode manually. This makes it possible if Codemirror can’t understand what kind of file it is, to pick the correct one your self. You do that by clicking the button on the bottom right. So for the example you see bellow the .edge file the editor don’t know what it is but then I can just change it to HTML. It would be good if you can always associate one kind of extension to a mode and you don’t need to pick it every time. But that is for the next version.
The next 7 days will be focus on search for files, so you can search for a file and open that one up in the editor. I guess I will just make a simple dialog with a search field and a few files that correspond with the search. This will need to be built on later. Then I need to have a nicer first page when you login where you can see all your recent project and status about your account. Nicer selection to create a new project. So that will be the main focus now.
When I started this project I wanted to learn more about docker but I have always also wanted to make my own IDE. One of the big challenge when doing an IDE is to get it as fast as possible so it feels as fluid as possible when you work. There are already a lot of good IDE so to see the small progress I make in my own I started to code via an SSH terminal to my server with a basic editor so I would go to my own IDE as soon as I get it to work. That was the thought at least and it have worked well. I just tried to get the basic finished so I could move away from the terminal.
The first I focused on was to get the login to work so I can have different users. Then I focused on the docker to be able to run the code in a separate container per user. After that I need to be able to fork code from git so that was the next thing. I also needed to be able to handle multiple projects per user so that was the next thing. I needed to get the frontend to work with the backend. So I needed to balance the two. In the beginning I focused more on the backend.
The very first “working” site I hade a tree view that could download the file and then I used a textarea to display and change code. The command to docker I used a text field and a textarea that was read only to display information from docker. This isn’t very effective but it was better then what I had before. So for me it was a step up. Then it was just see what I had most problem with and fix that part. I have change my textarea with code to codemirror to display the code. The docker is now using xtermjs. This is where I stand at the moment and I just want to fix some small parts and I think a first working version is done. After that it will be adding and refactoring in small chunks to get a better IDE step by step.
I hope you find this informative.