Exchange O' Learn

Exchange O' Learn

07 December 2018
Projects Let's Chat Projects

Translation made by DeepL Traduttore

TL;DR - Get to know the before, during and after of the Exchange O' Learn project to present it in the Stem Challenge 2017 competition. You can see the project repository in my portfolio.

As I mentioned, I participated in the Stem Challenge 2017 contest, the truth is that our development was quite good and we were able to deliver everything despite the many problems that the project delivery platform had.

But let's start at the beginning, there was a mail to the high school promoting the contest and our tutor, who I'm very happy to have had, decided to propose to participate, at the beginning I was the only one who wanted to participate, since I had nothing to lose, but I had a problem, to make the registration we needed a minimum of 4 people, so I had to convince 3 other people. The problem we had was that they had to be under the age of 18 when they signed up and more than half of the class was 18 or older.

In the end, I convinced 3 colleagues who knew little about programming, so I managed to convince them by telling them that they wouldn't have to program anything since I would be in charge of the development. All they had to do at first was to test the application, i.e. beta testers, and write the documentation for the project, i.e. the instruction manual. Okay, we already had a team, but to complete the first phase we needed a name and a logo. A member of the team immediately suggested that we call ourselves Anonimouse, and as there were no other proposals, we adopted that name. I designed the logo using a tool that I'm not going to name, but the result was this.

Anonimouse Logo


The truth is that the first phase was the least difficult for us to carry out, because, with the desire to participate, we did it almost without realizing it. At this point we still didn't know what to do for the contest, what I knew for sure was that I wanted it to be a web development project. We had to identify a problem in our environment, we chose to choose the internet connection because besides being very limited and slow, the teachers cut the connection to us. A teacher from the institute developed a project that by putting it on the server that acts as a gateway, can cut the connection to the outside of the classroom, but we can communicate internally. I leave you here the teacher's blog and here the repository of the project I am telling you about.

A few months ago I got in with a partner who knew some Front-End programming to do a chat in HTML5 and PHP, my partner did the Front-End and I did the Back-End. We never finished the project.

I took advantage of that idea to adopt it and add more features, as my colleagues didn't have to program anything, they thought it was a good idea.

We already knew that we wanted a web application to be able to share the information provided by the teacher, as well as create events in a calendar and maintain a classroom chat to share doubts with colleagues. In addition, it would not be necessary to have an internet connection to access and use it.

And that's where the first phase ended.

The second phase required in-depth project research, so we had to write a theoretical and methodological framework on our project, among other things.

Theoretical Framework

The background to this project is the problems caused by a slow connection to the Internet, or even offline, for daily class assignments. This is a waste of time for the correct teaching of the subjects, therefore, the research topic that we want to address in this project is to solve various problems found in a computer room with 25 computers plus a computer for the teacher.

The objectives to be addressed are:

 Share information and resources between students and teachers.
• Establish an active communication to share doubts and solutions, through a chat.
• Keep up-to-date information on important events, such as exams or paper submissions.
• Do not rely on a continuous connection to the Internet, using only the bandwidth of the local classroom network.

Methodological Framework

The mechanisms used for the analysis of our research problems have been a direct observation in the classroom day after day. The present project is proposed as a solution to these observed problems, taking as its main objective to improve the functioning in the classroom, both among students and among teachers.

To this end, we have devised, proposed and developed a functional solution to address this problem without breaking the structure and proper functioning of the classroom. Since the project was put into development, it has been in operation, so that as it progressed, we could see new needs that arose during the use of this tool.

For this reason, we have been able to arrive at a system that improves the functioning and communication in the classroom, as well as helping to offer resources in a quick and easy way among the students, in this way, we reduce the time lost trying to offer resources and tools, both among students and among teachers.

After that, we had to write down what technologies we had used and why.

• PHP 7
• CSS 3
• Angular.JS
• Bootstrap
• Datatables
• JQuery
• Colorpicker

We decided to use these technologies so that our application is updated with the latest web programming technologies, and we also decided to use Angular.JS to make it SPA (Single Page Application), so it is not necessary to update the page to show the data in JSON format, as it comes through an API created by us.

We also had to put the tools to use in the construction or design of the project.

• Ubuntu Server 64 bits
• Apache
• PHP 7
• phpMyAdmin
• Vsftpd
• Webmin
• NetBeans
• Filezilla

In addition, we also use Bootstrap Studio to create the functional prototype of our application.

Finally, we had to put in place the obstacles identified and the conclusions drawn from the research process.

One of the obstacles was that we had proposed that the application should use as little internet consumption as possible, so we couldn't use the CDNs for CSS and JS, so we had to include them along with the application, but taking advantage of the fact that it is on the local network the loading time is even faster and more efficient.

We needed this application as soon as possible so that we could have active communication and file transfers quickly and efficiently, without disrupting the operation of the classroom with regard to the consumption of internet access bandwidth, so we started to develop it as soon as possible.

The third phase was already the delivery of the project, we had to put a Youtube video as a presentation of the project, I did this editing as a promotional video.

We also had to put a short description of 100 words maximum.

We have created a fully functional web application that is now present in our classroom, allowing us to interact with all our classmates and the classroom teacher. Moreover, despite common internet problems, our application is not affected.

In order for them to try it, we had to provide them with some basic guidelines.

In order to start up the application, it will be necessary to have a web server to which to dump the source code, we must not forget that on some servers we will have to configure the file and folder permissions, access the server through a browser and install the application. We must remember that a connection to a database is necessary to install it. If everything has been installed correctly our application should be working. Remember that you can see the project documentation at

I created an installer to make it easier to set up the application, finally, we had to list the languages used in the development of the project.

• CSS3
• PHP 7
• JavaScript
• AngularJS

As the platform to send the phases was not going well, they decided to increase the delivery time, initially ending in June 2017, they extended it to mid-December 2017. I was able to take advantage of this to add functions that I had in mind, but that I wasn't going to have time to implement at first.

By October it was completely finished and in the testing phase in the classroom, in November I handed it in to get rid of it, as I had been on the project for more than half a year. Several days before the deadline, they extended it again until the end of December 2017. I haven't made any changes to the project since I turned it in because I was involved in other projects, one of which is this website.

As of today, February 7, 2018, they have already announced the finalists, but not the winners of the contest. Unfortunately, I am not among the finalists, but I am more than satisfied with the good work I did, if anyone is interested, I have it available in GitHub under the GPL 3.0 license, the link is in my portfolio.

Thanks to this project I learned to use AngularJS, I knew the good and bad things, thanks to the project I did it opened a new field of programming that I am currently exploring. In the future, I hope to be able to bring you projects made with this type of language.


With nothing more to say about the project, I say goodbye, a greeting and see you next week.

If you liked this post, you may also be interested in these...