Codenvy setup to demo applications using Docker: Java EE 7 with Angular
Development tools have been evolving over the last few years. Github revolutionized the way we share and contribute code between projects. Docker made distributions of applications much easier by allowing you to provide an environment for your application to run. Both these technologies simplified the distributions of your applications, but there is still a pain point. Developers that want to tap into your source, edit and build it still have a hard time to set up all the tools. I believe that Codenvy might be the tool to fill this gap.
What is Codenvy? Codenvy is an IDE in the cloud. You can use it to view, edit, build and deploy code. All of this with just a browser. Codenvy integrates closely with Github and Docker and here is when things become interesting. This allows you to set up an environment that you can share with anyone. Why is this interesting? I already had a few readers asking me for help to set up their environments because they struggle to do it themselves. Several combinations of IDE’s and Operating Systems make the task difficult. Maybe there is another way.
My application about Java EE 7 and Angular is probably the most popular I have. I’ve decided to provide it in Codenvy to hopefully make it easier for all of you that want to try the application out.
After you signed up for Codenvy, you can easily create a new project by pointing your working sources to a git repository. In this case we are going to use, of course the Java EE 7 with Angular Github repository. You might need to specify to Codenvy that this is a Maven project. If everything was setup properly, you should get something similar to this:
In the IDE window, you can browse the code with syntax highlighting and basic code completion. You can also build the project with maven, if you use the Build menu.
Checking the code is nice, but we are more interested in actually running the code. Codenvy uses a preset of Docker containers to cover a large number of application servers and environments. There can be found in the Runners tab. Unfortunately, there is no Runner provided for Wildfly and the Glassfish one, doesn’t come with the required database. I’ve ended up by writing my own Docker container to provide a custom made Runner for the Java EE 7 Angular sample application. Here are the Dockerfiles:
Codenvy Wildfly Dockerfile
This Dockerfile is just to set up the environment needed to run the application. Add Java and Wildfly to the base Codenvy container.
RUN cd ~ && \
sudo mkdir /usr/lib/jvm && \
sudo wget -q -P ~/ --no-check-certificate --header "Cookie: oraclelicense=accept-securebackup-cookie" http://download.oracle.com/otn-pub/java/jdk/8u40-b25/jdk-8u40-linux-x64.tar.gz && \
sudo tar -zxf jdk-8u40-linux-x64.tar.gz -C /usr/lib/jvm && \
sudo update-alternatives --install /usr/bin/java java /usr/lib/jvm/jdk1.8.0_40/bin/java 100 && \
sudo update-alternatives --install /usr/bin/javac javac /usr/lib/jvm/jdk1.8.0_40/bin/javac 100
ENV CODENVY_APP_PORT_8080_HTTP 8080
ENV WILDFLY_VERSION 8.2.0.Final
RUN cd ~ && \
sudo wget -q http://download.jboss.org/wildfly/$WILDFLY_VERSION/wildfly-$WILDFLY_VERSION.tar.gz && \
sudo tar -zxf wildfly-$WILDFLY_VERSION.tar.gz && \
sudo mv ~/wildfly-$WILDFLY_VERSION ~/wildfly
RUN cd ~ && \
sudo rm -rf *.tar.gz
CMD sudo sh ~/wildfly/bin/standalone.sh -b 0.0.0.0 && \
sudo touch ~/wildfly/standalone/deployments/ROOT.war.dodeploy && \
tail -f ~/wildfly/standalone/log/server.log
Codenvy JavaEE 7 Angular Application Dockerfile
This Dockerfile is to map the source code available in Codenvy to a folder in the Docker container. In this way, we can then deploy the code to an application server.
ENV CODENVY_APP_BIND_DIR /home/user/wildfly/standalone/deployments/ROOT.war
RUN sudo touch ~/wildfly/standalone/deployments/ROOT.war.dodeploy
Don’t bother too much about this. Codenvy will import into the project the Dockerfiles that are stored at the project structure in
.codenvy/runners/environments/[NAME]. Since I added my runner to the project sources, this will be imported automatically.
Run the Application
To run the application, just press the Play button in the top right corner. You should see the log of the container starting up and also an url at the bottom. This url is the one you need to use to access the application.
And that’s it! You can now play with the application! You even have a Terminal at your disposal.
Sharing the environment
It was easy to set up the environment here, but wouldn’t it be cool if we could just share it with other people? You could do that by using Factories. Just import your Codenvy project into a Factory and you have available an url to share, which will set up everything for you. So, to access the Java EE 7 Angular application, please use:
A few problems
Unfortunately, I’ve also encountered a few problems when I was setting up the environment.
- In Safari the Runner buttons are not visible, but they are clickable.
- In Firefox I couldn’t type a dash or other special characters in the terminal.
- Terminal sometimes is not visible.
The code not updating is a real pain. Other things are minors. I hope that this could be fixed soon.
Codenvy is a very impressive tool, if we take into account that we are talking about a cloud browser base IDE. I don’t think that Codenvy is going to replace conventional IDE’s. Although it’s a great alternative to distribute your applications and give the chance for other developers to try them out with minimal effort. Again, here is the link for the JavaEE 7 with Angular application:
Check the related posts: