The municipality of Nyköping has for a long period of time had complaints from its municipal residents considering the lack of information given about the municipalitys garbage collection. The municipality has not previously had data that has been able to respond to this, but now the municipality has compiled an Excel file with all current addresses considering the garbage collection. In order to be able to offer the information to the municipal residents, a search function was desired that could easily cater for this. The project was developed mainly in JavaScript and will be implemented in Episerver's environment that the municipality uses. The search function has been developed with an autocomplete function and takes into account all current garbage pickup intervals that the municipality has requested. / Nyköpings kommun har under en längre tid fått klagomål från sina kommuninvånare att det inte på ett enkelt vis går att tillhandahålla sig information kring när nästa sophämtning sker för deras adress. Kommunen har tidigare inte haft data som har kunnat svara på detta, men nu har kommunen sammanställt en Excel-fil med alla aktuella adresser och dess sophämtningar. För att kunna erbjuda informationen till kommuninvånarna önskades en sökfunktion som enkelt kunde presentera detta. Projektet utvecklades främst i JavaScript och ska implementeras i Episervers miljö som kommunen använder sig av. Sökfunktionen har utvecklats med en autocomplete-funktion och beaktar alla aktuella hämtningsintervaller som kommunen har önskat.

The architectural industry today struggles with how to best show their models to interested suitors opposite the construction industry which have the advantage of the fact that they can build physical models of houses which they can then show. This is where BIM comes into the picture. By extracting the graphics fromthese models and visualising them in a web browser this studyhas by creating a viewer with different navigation techniques sought to find out which techniques where most efficient for navigating models in the viewer. This was done with the help of user tests which results show that when it comes to projections, users were more efficient with perspective projection than orthogonal projections, however, user interviews show that users could still find a use for orthographic projection as it was better for displaying floor plans. Egocentric perspective were more efficient than allocentric perspective, but most users preferred egocentric perspective inside the models and allocentric projection outside of it. As for clipping objects and using clip planes, it is a closer race as users completed the task faster with clip plane but to a greater extent with culling of objects. However, most users wanted to use both technologies at the same time so that they could complement each other.

Visualization is an important tool for making data understandable. Visualization can be used for many different purposes, such as charts on the web used to visualize a dataset. Render time is important for websites since slow response times can cause users to leave the site. When creating a website with fast render times in mind, the selection of JavaScript library may be crucial. This work aims to determine if dataset size and/or chart type affects the render time of charts created by different JavaScript libraries. The comparison is done by a literature search to identify suitable libraries, followed by an experiment in which 40 websites are created to compare the performance of selected JavaScript libraries for rendering selected chart types. The results show that while both dataset size and chart type affect the render time in most cases, the libraries scale differently depending on the dataset size.

This essay is a documentation of the work that was made for the consultancy company GESHDO Now AB in which a solution was built to facilitate content management of the company’s website with modern frontend technologies. The basic requirement was to create a web-based editor, or a JAMstack-based project with a clear separation between the content and the layout. The requirement was to achieve the highest performance possible. The solution should be deployed with the help of a cloud service. A primary goal in this project is to liberate resources at the company, so that employees who lack coding skills can easily manage the content of the website without having to ask for help from the developers. Technologies such as React, Gatsby, GraphQL and TinaCMS have been used to create a user-friendly interface which lives in a protected environment in which it is easy to manage the content of the website in realtime. When the changes are saved, they will be immediately reflected on the website in production. The project has been built based upon the ideas of simplicity, reusability, scalability and easy maintenance, as well as the possibility to extend the solution and customize it for future needs. / Den här uppsatsen handlar om ett arbete som gjordes åt konsultbolaget GESHDO Now AB där en lösning byggdes för att underlätta innehållshanteringen på deras webbplats med moderna frontend-tekniker. Grundkraven var att skapa en form av editor, eller en JAMstack-applikation med en klar separering mellan layouten och innehållet. Dessutom ska prestandan vara så hög som möjligt. Lösningen ska publiceras med hjälp av en molntjänst. Ett huvudsakligt syfte med lösningen är att frigöra resurser på företaget, så att anställda som saknar kodkunskaper ska enkelt kunna hantera webbplatsens innehåll utan att behöva ta hjälp utav utvecklarna. Tekniker som React, Gatsby, GraphQL och TinaCMS har använts för att skapa ett användarvänligt gränssnitt som lever i en skyddad miljö där man enkelt kan hantera webbplatsens innehåll i realtid. När ändringarna sparas, så reflekteras de på webbplatsens liveversion. Projektet har byggts med enkelhet, återanvändbarhet, skalbarhet och enkelt underhåll i åtanke, och det är möjligt att utvidga lösningen och skräddarsy den utifrån framtida behov.

Diploma thesis deals with design and creation of framework for modern web applications. The goal of the thesis is to create a fast, modern and modular MVC framework designed to create modern SPA-like web applications that has all the advantages of SPA but minimize or completely eliminate its disadvantages. The theoretical part explores existing MV* frameworks mainly from Node.js, but also from PHP or ASP.NET. It also deals with the analysis of the requirements for modern web frameworks to incorporate the technologies that are really used or replace bad or obsolete ones. The work itself deals with the design and implementation of the new MVC framework for Node.js, including the client part and some development support tools. An integral part of the thesis is the creation of a sample application in the created framework. At the end of the thesis there is summary of the created solution and the results of the comparison.

This diploma thesis deals with the development of web 2D HTML5 game, which users can play through a web browser. For the wide availability of games for various game devices (personal computers, game consoles, smartphones), the game is developed using modern web technologies. At the end of the work, the web game (application) was deployed and tested on the web.

I discuss in this work tools used to build dynamic web-based aplications, focusing on Ajax technology. I introduce the components of this technique, its principles, usage, advantages and disadvantages.I describe a system, which uses Ajax for helping with realization of OLAP operations through dynamic tables. There is also description of these operations included, as well as introduction to possibilities of visual representation of their results.

The goal of the thesis is to study the Mozilla application platform - its structure, used technology, and the ways of development of standalone applications and extensions for the applications based on this platform (e.g. the Firefox web browser, the Thunderbird e-mail client). The thesis also contains relevant information about the used programming languages such as XUL, CSS, JavaScipt, RDF/XML and others. It describes the object oriented principles available in the JavaScript v.1.7 language. Next parts are dedicated to creating and using the platform components and the applications. The information about the platform is concluded by a presentation of the debugging and deployment possibilities. This knowledge is used to create an application able to watch changes of documents in a network environment. The thesis describes the application design and some details related to the general development of applications based on the discussed platform.

Despite a constantly growing selection of front-end JavaScript frameworks, there is a lack of research to guide the choice of which one to use in a software project. Instead, the decision is generally based on experience and personal preferences within the team. The aim of this thesis is therefore to present a structured evaluation model to provide for more informed decisions. A preliminary study is carried out where the most important qualities of a framework are identified, both according to previous literature and to practitioners. The pre-study result is used to construct a structured model to assess framework performance for the identified qualities. Finally, a test of the model is carried out to see if it can guide the choice of framework in a specific project. The study shows that the design of the model does contribute with important insights on framework performance in prioritized quality areas and the trade-offs that this entails for other important qualities. Thus, the model provides necessary information to make well-founded decisions. Furthermore, it fills the gap in contemporary research by providing an understanding of what is important in a framework according to practitioners.

Today there are a large number of plugins available for WordPress to manage various types of content and many of them work really well. However, one problem is that the user only gets the control that the plugin creator has allowed from the beginning. This project which uses the name JBlocks is made for the web development agency Fostira AB and is about the development of a Gutenberg block plugin for WordPress. Based on the company's requirements I have applied what I have learned from Webbutvecklingsprogrammet at Mid Sweden University. The main purpose of this project is to facilitate the company's daily production by providing full control over both the plugin and the blocks they mostly work with. This will reduce the workload and the time it takes to learn or configure possibly several different plugins. Hopefully this will also reduce the stress that may be associated with those tasks. My plugin consists of the most common blocks and it uses the same stylesheet to make it easier to customize the content for each specific customer. It is designed to be easily built upon by Fostira's developers if they need to in the future. The report describes all the different phases of the work from planning and the methods used to the construction and the final result. / Idag finns det en stor mängd plugins tillgängliga för WordPress för att hantera olika typer av innehåll och många av dem är väldigt bra. Ett problem är dock att användaren bara får den kontroll som skaparen av pluginen tillåtit från början. Detta projektarbete som går under arbetsnamnet JBlocks är utfört åt webbyrån Fostira AB och handlar om utvecklingen av en plugin för Gutenbergblock i WordPress. Utifrån företagets krav har jag tillämpat mina kunskaper från Webbutvecklingsprogrammet via Mittuniversitetet. Arbetets huvudsyfte är att underlätta företagets verksamhet genom att ge full kontroll över både pluginen och blocken som dom oftast jobbar med. Målet är att minska arbetsbördan för de anställda och reducera tiden de behöver spendera på att lära sig eller konfigurera plugins. Tanken är också att detta ska minska den stress som detta kan leda till. Mitt plugin består av de vanligaste blocken och använder en och samma stilmall för att enklare kunna anpassa innehållet åt varje specifik kund. Den är skapad för att på ett lättbegripligt sätt kunna byggas på av Fostiras utvecklare i framtiden om behovet av fler block skulle uppstå. Rapporten beskriver alla arbetets olika faser från planering och de metoder som använts till konstruktionen och det färdiga resultatet.