The object of the study is a web application for recording students' learning activities. The purpose of the work is to develop a client's part of the program for accounting of students' educational activities. The way to create a site is using the Bootstrap and AngularJS frames, as well as the programming language HTML, CSS, JavaScript. In the diploma project the program implementation of all pages was made, the design and user interface and the front-end part were added to the data (students, subjects), the creation of a student search filter by specialty and group, the student transfer algorithm, the formation of documents with .doc extension, as well as their archiving, adding personal data of students, and developed a system for monitoring students' progress. The stages of creation of local web applications, the list of popular frameworks and their general characteristics are considered.
List of used technologies
The diploma project used the following technologies:
HTML is a markup language with tags. That is, an HTML document will consist of a certain group of elements, where each element will be determined (start and end) with a specific tag (For some elements, the end tag is not required). That is, a tag is the name of an element written in corner brackets (<>). Each HTML tag has its own unique name with a specific syntax, which is written in Latin letters and is not case-sensitive.
CSS (Cascading Style Sheets) is a collection of layout and formatting rules that can be applied to different elements of a page. To assign an element of certain characteristics, you must once describe this element and define this description as a style, and in the future simply indicate that the element to be drawn up in the appropriate way must accept the properties of the described style. You can apply a style sheet to an HTML document in three ways: • apply external styles (as a separate text .css file) using the link element • embed styles directly into an HTML document (as a block of css text) using the style element • apply inline-style, that is, assign a style to a specific HTML element directly in the document, using the HTML style attribute.
Bootstrap is a CSS / HTML framework for creating websites. In other words, this is a set of tools for layout. It has a number of advantages, thanks to which BS is considered the most popular of its kind. Advantages : Speed of work - thanks to a lot of finished items layout takes much less time; Scalability - the addition of new elements does not violate the overall structure; Easy setup - styling is done by creating new CSS rules that are executed instead of standard ones. You do not need to use attributes like "! Important" A large number of templates; Huge community of developers; Wide scope - Bootstrap is used for OpenCart, Prestashop, Magento, Joomla, WordPress and others. Bootstrap is especially popular to create a lading page. Bootstrap is a set of three frameworks: CSS / html, JS-components and iconic fonts.
AngularJS is an open source JavaScript framework. Designed to develop WEB-applications that work without reloading the page. His goal is to simplify the development of complex browser-based applications, as well as simplify testing and development. Google is actively developing. AngularJS is designed with the conviction that declarative programming is best suited for building user interfaces and descriptions of software components.
JavaScript is the name of the implementation of the Netscape ECMAScript programming language standard, based on the principles of prototype progaming. The most commonly used and most widely used language is script writing for web pages, but it is also used to implement object management scripts embedded in other programs. With the help of JavaScript you can dynamically modify the text of the downloaded HTML document and respond to events related to the actions of the visitor or the confines of the status of a document or window.
JQuery is a JavaScript library that focuses on the interaction of JavaScript, HTML and CSS. JQuery allows you to write just one line of code to execute such actions for which JS would have to write many lines. It provides a lightweight and flexible cross-browser DOM messenger (document model objects) toolkit using CSS and XPath (query language, to select nodes from XML documents) selectors. A library is a file that includes all of its DOM, events, effects, and AJAX features. It can be added to the web page with a link to a local copy, or one of the copies available on an accessible server (for example, Google).
Ajax is an approach to building interactive user interfaces for web applications, developed on javaScript, which in the background (without reloading the entire page, as in PHP) allows the exchange of data between the browser and the server. Its advantages: Saving traffic. Data is transmitted only to a specific part of the page, which significantly reduces traffic. Reduce server load. No need to update the page altogether, there is a specific request. For example, you wanted to vote on the site. After clicking the button, the data is sent to the server in your voice, and the answer is returned. At the same time the page itself is not updated. Only the result changes. Rapid work of the service itself. Since the robot happens to a specific block, the result of its work can be seen much faster.