TravelNotebook is a MEAN application with CRUD functionality using MongoDB (with MongooseJS), Express, Angular and Node. TravelNotebook is an app to create and keep track on your travels, similar to blog. You can even filter posts by selected country or go back to show all. Under each travel post you can open a notebook and add several notes for the selected travel post.

TravelNotebook is an app to create and keep track on your travels, similar to blog. You can even filter posts by selected country or go back to show all. Under each travel post you can open a notebook and add several notes for the selected travel post.

This project was done by me and two other students in our class, Sandra Widmark and Stina Sköld. That was really cool and challenging!

Learned how to use Debaser's API to post all availale music events for the date and venue that the users select.

My first interactive game made using HTML5, CSS and JavaScript. Enjoy and show a master class in guitar chords knowledge!

My first interactive ToDo Web Application is now ready! That was again very interesting and challenging to do. More coding with JavaScript, great! I've even had a little practice to implement a media queries within JavaScript and it worked well. I also learned and got my first practice with Web Local Storage and JSON files. That was probably the most challenging part for me as I never worked with them before. It will be nice to get more knowledge of that.

My first Interactive Infographic is now finished! That was a challenging assignment but very interesting!

I decided to create infographics that would help anyone who want to play a song "Silent Night" (by B.J. Thomas) on guitar. Becides the song lyrics you can see a guitar tabs and you can even listen to how each chord sound if you click on chords and tabs.

While coding I used Bootstrap grid system to create a responsive design and JavaScript and JQuery to make the interaction possible.

I was very glad and inspired when we got an assignment to create our first web design agency website from scratch i.e. from concept to the actual well-designed and functional webpages. Before we could start programming a lot of conceptual decisions should have been made. What will be the main purpose of our agency and who will be our customers? What logotype and graphical design we choose? What programming approach we choose to create attractive and functional webpages? What tools will we use to let our customers to communicate with us using our website? How we will organize our group work and how will we split the responsibilities between the team members?

In order to organize our work progress in a good and efficient way our team was working according one of the agile methods Scrum. For the first time I got to actually experience how easier the work can be by using this method. It was interesting and challenging to try a Scrum Master role i.e. responsibility to organize our team work and inspire and help whenever needed.

During our first group meeting we’ve decided to have a Sprint planning meeting in Slack once a week and we used Trello to plan and have track of our tasks during each one-week sprint. During the week we communicated via slack, in channels created for specific purposes, like daily scrum, deadlines or e.g. channel for mockups. That made it easier to find the information you need later on in each channel and keep deadlines.

While building our website we decided to create a website with one html page including 4 different sections: landing page, page about us, portfolio and a contact page. With this approach we give our users a choice to both scroll up to the last page and navigating between pages using navigation menu. Each member of our group had an opportunity to come up with our company name and purpose, to design own logotype and a mockup for each webpage. I think it was a great decision as we all had an opportunity to try all parts of this process and share more different ideas. Instead of choosing someone’s individual winning concept we have chosen to combine our best ideas.

Already on the mockup stage we decided to sketch our webpages on 3 types of platforms: desktop, tablet and mobile. That would help us to make our webpage as responsive as possible and to make the coding stage more fast and efficient.

We used GitHub version management system. That was challenging but very good experience of the frontend developers team work while coding. We did not have many coding conflicts as each of us was mainly working on only one page/section in html and css for it. However, of course, if any help was needed or any of us had a better code solution for some parts than each of us was ready to help and share.

I was very glad and inspired when we got an assignment to create our first web design agency website from scratch i.e. from concept to the actual well-designed and functional webpages. Before we could start programming a lot of conceptual decisions should have been made. What will be the main purpose of our agency and who will be our customers? What logotype and graphical design we choose? What programming approach we choose to create attractive and functional webpages? What tools will we use to let our customers to communicate with us using our website? How we will organize our group work and how will we split the responsibilities between the team members?

In order to organize our work progress in a good and efficient way our team was working according one of the agile methods Scrum. For the first time I got to actually experience how easier the work can be by using this method. It was interesting and challenging to try a Scrum Master role i.e. responsibility to organize our team work and inspire and help whenever needed.

During our first group meeting we’ve decided to have a Sprint planning meeting in Slack once a week and we used Trello to plan and have track of our tasks during each one-week sprint. During the week we communicated via slack, in channels created for specific purposes, like daily scrum, deadlines or e.g. channel for mockups. That made it easier to find the information you need later on in each channel and keep deadlines.

While building our website we decided to create a website with one html page including 4 different sections: landing page, page about us, portfolio and a contact page. With this approach we give our users a choice to both scroll up to the last page and navigating between pages using navigation menu. Each member of our group had an opportunity to come up with our company name and purpose, to design own logotype and a mockup for each webpage. I think it was a great decision as we all had an opportunity to try all parts of this process and share more different ideas. Instead of choosing someone’s individual winning concept we have chosen to combine our best ideas.

Already on the mockup stage we decided to sketch our webpages on 3 types of platforms: desktop, tablet and mobile. That would help us to make our webpage as responsive as possible and to make the coding stage more fast and efficient.

We used GitHub version management system. That was challenging but very good experience of the frontend developers team work while coding. We did not have many coding conflicts as each of us was mainly working on only one page/section in html and css for it. However, of course, if any help was needed or any of us had a better code solution for some parts than each of us was ready to help and share.

Here is CSS Zen Garden Webpage designed with CSS. Here is a Wireframe to CSS Zen Garden Webpage. Here is a link to GitHub repository.

An Apple Pie HTML webpage! A recipe of my favourite apple pie is there :)!

The first website was launched on the World Wide Web in 1991. That was a webpage with a quite simple design based mainly on text and tables. Since then Web was progressively developing, great improvements has been done on its functionality, speed and graphical design. Besides the growing amount of web services and applications like Google Maps and social media available, the web has become more client oriented and allows the users not only to interact through the web but even create the content by themselves. But what and who should we thank for this amazing progress? What knowledge is required and what role does each member of the web development team has?

To develop a user-friendly and well and fast functioned website or application with a beautiful high-quality design requires a team of quite a few experts with different backgrounds. Besides the content producers, support team and Quality Assurance (QA) experts, the web development team includes:

• Backend developers who work on the server-side development. Primarily they build an application by creating a code in PHP, Ruby, C#, .NET or/and Java which communicates with databases like e.g. MySQL and transfer the data from and back to the user interface.
• Web designers including a team of graphic designers who create a high-quality visual elements like e.g. icons and choose the suitable typography; and User Interface (UI) and User Experience (UX) designers who work on the layout and interaction models of the webpages.
• Frontend developers who work on client-side development.

I am now studying and so far aiming to mainly work in frontend so I would like to make a closer look on what role the frontend developer has. As I’ve mentioned above the frontend developers are mainly working on the client-side development i.e. specifically on the visible interface that the user can see and interact with. In general, the frontend developer creates clear, fast, functional and user-friendly webpages and interfaces while writing a code using at least three main programming languages: the HyperText Markup language (HTML) which provides a framework of the web page layout, Cascade Styling Sheet (CSS) used to describe a visual representation and formatting of the document written in HTML and JavaScript - an event-based programming language that is used to transform a static HTML page into a dynamic interface i.e. to enable a web page to interact with its user. To write a code using the above languages the developers use Development Environments (IDE) which in general is a code compiler with different features implemented depending on the programming language. The main purpose is to make the programming process easier. There are many IDEs available like WebStorm for JavaScript, IntelliJ commonly used while coding in Java but which one you choose is a matter of programming language choice and taste.
There are many literature and internet sources providing information on what knowledge and experience should one have to be a successful member of the frontend development team. However, to get a better insight into frontend developing work I interviewed one of the frontend developers working at the OnSpotStory company.

OnSpotStory is the leading Nordic company that is working on building web and mobile applications that provides their users information about different historical places in form of guides and could be run on IOS, Android and other mobile platforms. Using the GPS location, QR code reading function or the dial-in service the user can easily get a historical information about the place or an object at the location you are at the moment. Guides are provided by the OnSpotStory app with text, video, images and even sound. Their team is currently working on a mobile game application, a museum guide system, that aim to help children to learn the Swedish culture history in an interactive and entertaining way.

My interviewee’s current development team consists of one project leader and two backend/frontend developers. From my interviewee’s point of view their team is quite small and he wishes that more members would join to be able to do a proper work fast enough. However, so far they do not experience any bigger problems. They are constantly trying to apply the Agile Methods of their project management while working on their projects in the best way they can under current circumstances. After the project aim is defined they discuss and the make a good planning of the future work. However, while working on the project they always try to be flexible and easily adapt to any changes that should be done whenever needed.

As their team do not include any graphical designer, they get help from an external graphical designers when some features need to be graphically designed before they could start to code the Graphical User Interface (GUI). However, from my interviewee’s point of view, any successful frontend developer should have a good knowledge on and understanding of Scalable Vector Graphics (SVG) to be able to create a web page with visual elements with high quality and best resolution, and to be able to make them interactive.

In order to develop mobile applications they are using a project called Apache Cordova. Apache Cordova is a set of device application programming interfaces (APIs) which allows a mobile app developer to compile an application on tablets, IPhone and Android by using just HTML, CSS and JavaScript combined with a User Interface (UI) framework library such as jQuery Mobile which is similar to usual jQuery library but specifically made for mobile applications. They use Git as a Version Control System (VCS) to perform a constant version control.

It happened to be so that the person I interviewed, before starting to work as a frontend developer, had a deep knowledge and quite big experience in backend development. So, he even created a Content Management System (CMS) for their applications written in PHP following most of the Representational State Transfer (REST) protocol for best performance. CMS is basically a computer application that allows the connection to and communication with the database, specifically to store and organize files, and provide version-controlled access to user’s data. The OnSpotStory app CMS makes it possible to manage all of the user’s guide data without needing to send it to OnSpotStory in case they want to use a feature to create their own guides using the app. He also developed a code in JavaScript that handles and transfers big size data in a fastest possible way.

At this point my interviewee pointed out that even it is not essential for the frontend developer to have as good knowledge in backend as he has himself but it is important to have a good understanding in backend to be able to communicate well with the backend developers and understand each other’s needs.

He also mentioned that during the development stage they always test their application first on different web browsers. Some of them can differ in functionality, in e.g. size of memory storage and could have other specific limitations that the frontend development should be aware of and account for. These sometimes quite small differences can have a big impact on the JavaScript you write.

He also added that while working on the codes he always tries to be consistent with his chosen good working standard, for example constantly follow a good structure of the technique he writes the code with. It makes it easier to do changes in the code that was written some time ago whenever needed if you e.g. name your variables and functions in the best descriptive way and do not change it in your next scripts.

On my last question – “How you sees the future of the frontend developer and what new interesting features could appear in the digital world?” - my interviewee replied that both JavaScript language and the frontend developer’s services in general will continue to be constantly used and needed. Nowadays, a frontend developer do not just create a webpage but writes a complete program in form of web and mobile applications. More and more different new platforms and portable devices we see appearing on the digital world market. And as it is a frontend developer’s role to make it possible to run different applications on these new devices and platforms, the need of frontend developer will only continue to grow. As an example of the new cool project, he mentioned a development of the virtual reality experience using just a web browser. So, it is possible to create a website with 3D image and video working feature using JavaScript. He thinks that when Sony’s Oculus and Samsung’s new feature will be enough developed a virtual reality experience via website will be launched and that will have high popularity among its users.

Web development made a huge step forward since the web was launched and began to be available for users. There is a big improvement of its speed, functionality and graphical design. It became more user directed and last but not the least a great number of services that are provided online on both PCs and other portable devices like smartphones.

It is hard to say how the web will look like in 5 years but I think a lot will continue to depend on the user needs and the creativity of the web developer. I think the more work will be done to make the web more secure (virus protected) and faster so that it will take even less time to download the web pages irrespective of how much information the web page has (text, images and video). There will be more improvement in graphical design. Better resolution and line precision, more balanced color and possibly more of the 3D effect of images and text on the web page.

Nowadays there are so many services available on the internet e.g. bank services, shopping, learning tutorials, social media, GPS, maps, TV online and many applications on the smart phone and devices other than PC. The amount of those services will of course grow depending on the customer needs and they will be more easy-to-use and secure so that, for example, the customer will be willing to make payments for and use more services online with no feeling of risk.

Despite the progress so far, both users and the web developers are still experiencing problems with the compatibility of the web page on different web browsers and platforms. I may guess, the big improvement could happen here as well. It will either be one and only, well functional web browser be developed or all other will come to its best functionality so that the web developer would not need to think so much about the compatibility.

What I would wish myself is that less advertisement would appear on different websites. I understand the need of it but the web page could be designed so that the advertisement will be there without visually disturbing so much the main content of the web side. Also, I wish that more improvement will be done for the websites providing direct online services for research data and statistical analysis. They could be more functional, more user friendly and faster. More information on the theory behind each test could be added to make it easier for the user to understand the choice of this or that test.