[2024]Digital Global Overview Report 2024 Meltwater.pdf
Development of multiplatform cms system with zend framework
1. Development of Multiplatform
CMS System with Zend
Framework
S. Vuković, M. Löberbauer ,Z. Čović and M. Ivković
Subotica Tech – College of Applied Sciences/Department of Informatics, Subotica, Serbia
Institute for System Software, Johannes Kepler University, Linz, Austria
University of Novi Sad, Technical Faculty “Mihajlo Pupin”/Department of Informatics,
Zrenjanin, Serbia
sinisa@vukovic.co, loeberbauer@ase.jku.at, chole@vts.su.ac.rs,
misa.ivkovic@gmail.com
26th October 2012.
International conference on Applied Internet and Information Technologie
2. IIntroduction
Internet impact to global
business environment
Increasing number of mobile
devices
User experience on tablet
and mobile devices
3. Framework
What is a framework
Idea of framework
Advantages of using a
open-source framework
13. Conclusion
Use framework to develop web applications
faster
Use MVC pattent to increase application
maintainability
Use responsive design to increase
multiplatform support
The purpose of my presentation is to talk about the problem the ‘we’ ….. Developers…… are dealing, with when developing a web application. Because of the emergence of the internet… it has led to changes in many aspects of human activity. The biggest impact that internet has is the development of the global business environment. The second impact is happing right.... And that is the emergence of smart phones. Today… we have increased number of people how are accessing the web from the mobile devices and this trend will continue to grow.When we are building web applications we have to think not only about user experience on desktop computers but we also have to think about user experience on tablet and mobile devices.Because of this facts, we have to build multiplatform and multifunctional web applications.
Building applications without the framework is not good idea… cuz we need more time to develop… our applications are not that secure and not well structured and most important thing about not using a framework is when we have to integrate new developer to our project. Now… what exactly is a framework, a framework is a set of libraries and environment that allows programmers to develop web applications faster and more organized. The main idea of the framework is using frequently used functions and basic structures upon witch programmers can develop their applications. Most experienced developers have their own libraries, which are used on a project basis for faster growth. However, the development of web applications, based on open-source frameworks has its advantages. Open-source framework is more reliable, because is tested and used by many programmers. The biggest advantages of using frameworks is that all developers in a team working on a project should follow the same rules and conventions when developing web applications.This allows easy integration of new developers to work on the project if they are familiar with the rules and conventions of the used framework.
Framework that we (ili da kazem ‘I’) used is zend framework.Zend framework is an open source framework for the development of web applications and it is based on the PHP programming language. It contains a group of tools for design and implementation. Each group contains built-in functions for input and validation of data, caching, security and so on. Unlike other frameworks zend used so called Looselycoupledarhitecture.This means that although the framework includes a number of components, these compontents are independent of each other and have minimum interconnection.Zend also provides a complete implementation of MVC pattern. MVC is widely recognized design pattern that separated our database and business logic from the presentation layer (in this case, XHTML, XML).Separation of presentation and logic aids in maintainability, by producing clean and understandable code. This means that the developer can update the layout and design of a site withour having to worry about wading through PHP script.
Software design patterns are a standard solution to common problems. This means that although implementations and solutions are different, the concept of problem solving is the same.If you think of a Zend Framework application like a circus then the front controller is the ringmaster, whipping the acts into shape and making sure the audience is satisfied.So who does front controller handles the cliends request. When a request arrives, the Web server’s .htaccessfile automatically rewrites it into a standard format and passes it on to the index.phpscript. This script sets up the application environment, reads the application configuration file, and creates an instance of the front controller.The front controller examines the request and determines the key components of the URL. It then attempts to route the request to an appropriate controller and action. To perform this routing, the front controller will check both default and custom routes, and make use of pattern-matching techniques to select an appropriate target for the request.If a match is found, the front controller transfers control to the corresponding controller and action. Once invoked, the action makes changes to the application state using one or more models. It also selects the view to be displayed and sets any required view properties. Once the action has completed, the selected view renders its output, wrapping it in a layout as needed. This output is then transmitted back to the requesting client.
Most often we have seen that there is no optimization and adaptation of existing sites or new sites for mobile users. The web content might be too wide to fit the screen of mobile device – user equipment. Often, web pages that have been initially designed for desktop computers are too encumbered with content so they are practically unsuitable for users accessing them via mobile devices A solution for this problem is to use some kind of detection and adaptation. In the development of this CMS system a responsive design approach is used. Responsive web design is the approach that suggests that design and development should respond to the user’s behavior and environment based on screen size, platform and orientation. The practice consists of a mix of flexible grids and layouts, images and an intelligent use of CSS media queries. As a user switches from his laptop to his iPad, the website should automatically switch to accommodate for resolution, image size and scripting abilities. In other words, the website should have the technology to automatically respond to the user’s preferences.
The idea is to first code the Default layout (width of 992px), and then use CSS3 media queries to code several child layouts: 768px, 480px and 320px width. The Default layout will be served to any browsers that do not support media queries, whereas the child layouts will be served, as appropriate, to browsers that do. They will also inherit all styles given to the Default layout, so coding them is very fast. To break it down, recent versions of Firefox, Chrome, Safari, Opera, Nokia Webkit, WebOS, Blackberry OS, as well as Internet Explorer 9, Android Webkit, and Mobile Safari (all iPhones, iPads, and iPod Touches) will use the layout most appropriate to them. Internet Explorer 6–8 and most old mobile devices will only use the Default layout.The goal is to make building websites with multiple layouts efficient, and to make the layouts feel consistent. Since every layout is based on the same grid, elements used in one layout can often be reused in the others without changing them. For example, simply adjusting the width or font-size of an element in one layout is often enough to make it work in another. And even if more changes are required, the common baseline grid and type presets will make the element fit in. Figure 2 shows the main page of the CMS implementation, which uses this approach.
Forthe realization of this CMS system we (I) used: HTML5, CSS3, jQuery with AJAX, PHP and MySQL database.
CMS system is divided into front-end development (public) and back-end development (administration).
The public part is more focused on interactivity, design and optimization for mobile devices. The public part consists of amain page, ablog section, agallery, and pages. The main page or index page is the place where we want to segregate important information or parts of our site. The blog section consists of articles, which can be filtered by categories or tags. A single selected article contains headline, date created, category that belongs to, body text, social widgets, tags, related posts and facebook comment. The gallery consists of albums. While pages are used for creating independent pages like ‘about us’, ‘contact’ etc.
The administration part is protected and only two types of users can access it – administrators and writers. Depending on the role some parts of the administrative area are not accessible. This panel consists of dashboard, users, categories, posts, pages, menu section, gallery, and settings panel.
Developing web applications with frameworks reduces development time and increases maintainability. Using responsive design increases the support for multiplatform with a minimum effort and with only a single design. The main disadvantage of optimization based on CSS media queries is that only a small number of old devices support it.
