Tag Archives: programming language

tubik studio web development

Front-End Development. From UX Design to Code.

User interface serving the aims of positive and problem-solving user experience is one of the key aspects of creating digital product, still it’s web development that enables users to get real and live surfing experiences. With the course of time, more and more businesses are going online, so there appear some loose ends that need to be cured through user experience. In business struggle, everyone wants to please their customers and engage them to return again. Today, businesses realizing the value of thought-out and professionally built user experience are able to take the best from digital technologies and products. Full-cycle UX design gets its live version via web and mobile development transfroming step by step from subtle idea to real digital product.


Getting down to cases, online businesses are all about user experiences and of course the products and services they are selling. Have you seen websites like Amazon, eBay, AliExpress? They are convenient and helpful for their users even being huge websites that offer millions of products and thousands of services. The value of thought-out UX and efficient UI is irreplaceable. How could this result be achieved? This is the point when the power of front-end development comes into play to not just enhance the look and feel of website but also take the major role in increasing the level of user experience.


Tubik Studio design team


What is front-end?


All websites consist of structure, data, design, content, and functionality. Creating user-facing functionality is the task of front-end developer. Using a combination of markup languages, design, client-side scripts and frameworks, they create everything that users see and interact with: content, layout, and functional elements.


Three main parts of every website are: the client, the database, the server. The client is simply the web browser a person is using to load a site, and it’s where client-side technology is unpacked and processed. In a general way, a server is a computer, a device or a program that is dedicated to managing network resources and data. The server is at a remote location anywhere, it is holding data, running back-end of a website, processing requests, and sending response to the browser. The client is anywhere the users are loading a site: mobile devices, laptops, or desktop computers. Server-side scripting is executed by a web server; client-side scripting is executed by a web browser.


front end develoment tubik studio


Let’s have a closer look at this process.


The Server — this part of website is responsible for holding data, running the website’s back-end architecture, processing requests, and sending response to the browser.


The Client — requests pages from the Server, and displays them to the The User. In most cases, the client is a web browser.


The User — uses the Client in order to surf the web, fill in forms, watch videos online, in other words and interact with webpage.


web development server


To see how it works in practice, let’s take the flow of interactions with Tubik website for example.


The User opens his/her web browser (the Client), then loads http://tubikstudio.com/. The Client (on the behalf of the User) sends a request to http://tubikstudio.com/ (the Server), for our home page. The Server then acknowledges the request, and replies the client with some meta-data (called headers), followed by the page’s source. The Client receives the page’s source and renders it into a human viewable website. The User types «Case Study» into the search field, and presses ‘Enter’. The Client submits that data to the Server. The Server processes the data, and replies with a page matching the search results. The Client, once again, renders that page for the User to view.


Processes running in web browser are the following: when the page is in process of loading, scripts are embedded within and interact with the HTML of a site, selecting elements of it, then manipulating those elements to provide an interactive experience. Next, scripts interact with a CSS file that styles the way the page looks. It dictates what work the server-side code will accomplish and returns data that’s pulled from the site in a way that’s readable by the browser.


For example, when we open home page of Tubik Studio website, the back-end is built to pull specific data from the database to Client, while front-end scripts render this data into readable for human view webpage.


Front-end languages


Widespread client-side languages which front-end developers use regularly and have to know include:


JavaScript: With its frameworks and libraries, it’s the core of front-end development, and beyond. It is called the first client-side language and is still the most common client-side script on the web.


HTML: Every front-end developer has to know this language. It dictates a site’s organization and content and all interaction. HTML elements can annotate footers, headers, how text is displayed , how media and images are appeared, and more.


CSS: Cascading style sheets (CSS) is broken into modules and comprises the code for every graphic element—from backgrounds to font—that make up the look and feel of a website.


programming languages fron-end


Front-end frameworks


A framework is a hierarchical directory that encapsulates shared resources, such as a dynamic shared library, nib files, image files, localized strings, header files, and reference documentation in a single package. Here are some popular frameworks that are usually used.


AngularJS: This framework and several other JS frameworks, like Backbone.js, Ember.js, Express.js or ReactJS demonstrate the capabilities of JavaScript.


jQuery: It is a fast, small, JS object library that streamlines how JavaScript behaves across different browsers.


Bootstrap: This leading mobile-first framework includes HTML, CSS, and JavaScript to facilitate rapid responsive app development. With Bootstrap, website is compatible with all modern browsers and looks great on any size screen, from tablets to phones, from laptops to desktop computers.


Foundation: Responsive front-end framework is used by sites like Facebook, Yahoo!, and eBay.


Semantic UI: It is a development framework that helps create beautiful, responsive layouts using human-friendly HTML.


Yeoman: It is a generic scaffolding system allowing creating of any kind of app.


Pure.css: It is the set of small, responsive CSS modules that you can use in every web project.


Skeleton.css: As Skeleton’s developers stated: “A dead simple, responsive boilerplate.” It is the set of small and easy, responsive CSS modules that can be used in every web project.


web development framework


The next posts about web development are coming soon for those who are interested and in them we are going to tell you more details about different aspects of the job: the closest ones will tell about specific features and tools for back-end, web developers work flow, and trends for front-end development. Don’t miss!

Welcome to read the article about basic terms and tools of web development

Welcome to see the designs by Tubik Studio on Dribbble and Behance

front end develoment tubik studio

Web Development. Basics of the Job.

It seems that there are crowds of web developers here and there, still the job is marked among those which are always in demand. The growing number and diversity of professionals doesn’t set the scarcity of places on the labor market in the sphere. And the reason is really simple: people around the world open more and more opportunities provided by modern websites for all the spheres of professional and personal activities.


“Everyone wants a website,” says Brandon Swift, co-founder of Santa Barbara-based Volt Commerce. “As a web developer, you’ll never be short on work. I mean never!” And that seems to be pure truth: total employment in this sphere is projected to grow 27 percent through 2024, three times faster than average for all occupations according to the U.S. Bureau of Labor Statistics (BLS). British resource National Career Service also provides statistics showing the dynamic growth and it is forecasted to continue.


statistics web development jobs


So, naturally there are more and more people who start their path or broaden professional horizons in the sphere as well as growing number of customers who need to get into basics of the job for understanding the process and setting effective collaboration  with web designers and developers. 


Nowadays, average internet users often confuse web design with web development, but there is a huge difference between the two. That is why we have decided to start the series of posts in Tubik Blog unveiling basic and specific aspects of web development for all those who are interested in the theme. Today let’s start talking about the basics.


What is web development?


Web development is the process of building a website or web application from scratch which includes creating custom code to accommodate unique needs, developing everything from the site layout to features and functions on the webpage or web application.


Typically, web developer’s primary task is building reliable and high performing website or web application. What should we get as the basis of web development process? First of all, it is necessary to know main areas of web development and specificity of each.


web development


What are main areas of web development?


Client-side scripting — types of codes that execute in a web browser and determine what users will see when they open a website.


Server-side scripting — types of codes that execute on a web server and produce a response customized for each user’s request to the website.


Database technology — software applications which allow defying, creating, querying, updating, and administering databases.


In point of fact, in large-scale web projects these parts of web development are often delegated to multiple web developers for higher workflow speed and productivity: one programmer may focus on server side of a website while another focuses on the client side to add style and functionality to the website or web application.


Considering the above-mentioned issues, let’s take a closer look on what languages and tools web programmers should know in each of these fields.


What is used for web development process?


Codes of client-side scripting execute themselves within the browser of a user’s computer, like storing user data in cookies, simple flash games, web applications or other. Client-side development is done almost exclusively on JavaScript in addition to basic HTML and CSS code.


Here are some examples of client-side programming languages:

  • HTML
  • CSS
  • JavaScript
  • Flash
  • Microsoft Silverlight


Server-side scripting is the type of coding used by web developers to build reliable user-server connection and vice versa. A web browser’s storage is limited by the end user’s computer, so websites need to host the files and images that make the site work in a database on a web server. This area of web development includes building the framework that allows the database on the web server to communicate with the web browser of the end user’s computer. Need to notice, server-side code is also more secure, because using a website the user has no direct access to source code and proprietary databases.


Here are some examples of server-side programming languages:

  • PHP
  • C++
  • C
  • C#
  • Java
  • Python
  • Ruby
  • Erlang


In order to work properly, every website needs a database to store its code, images, files and other data. These relational database management systems (RDBMS) are the most popular for web-based applications:

  • MySQL
  • PostgreSQL
  • MongoDB
  • Microsoft SQL Server
  • Oracle
  • Sybase
  • IBM DB2


web development and programming


Bottom line


In a broad sense, web development includes web design, but also includes web content development, client and server side scripting, server and configurations security as well as e-commerce application. Web development is of paramount importance to any new or established business. Website is a useful method of presenting the list of the services and products offered by someone to the wide and diverse audience of internet users, it will provide understanding why these products are relevant and even necessary for them to buy or use, and presenting the company’s qualities setting it apart from competitors.


Web development has also impacted personal relations. Websites are no longer simply tools for work or e-commerce, but serve more broadly for communication and social networking. Websites such as Facebook, Twitter, Instagram provide users with a platform to communicate and organizations with a more personal and interactive way to engage the public.


If you are interested to read more about web development, don’t miss our next post which will be devoted to client-side scripting. It is going contain detailed descriptions of this area and show how front-end functions. Join in!

ios development tubik swift objective-c

Swift or Objective-C? Tool Tips for iOS Developers.

In creative process, there are always some points of choice and contradictions. While UX designers are debating about Photoshop vs Sketch theme and give their opinions on efficient prototyping tools, iOS developers also have their own big debate. Today we are going to pitch in and add some of our thoughts to this global discussion of which programming language is better, Objective-C or Swift. We asked Tubik CTO and experienced iOS developer Maria Nazarenko to share her opinion with Tubik Blog readers.


Brief background


Let’s start with a tiny bit of history. The first and therefore the eldest in the discussed pair of programming languages was Objective-C. Primarily it saw the light of the day in early 1980s and was created by Brad Cox. So, one of the points that could be definitely applied to this programming language is that it’s really tried-and-true and tested by several generations of developers.


At the moment Objective-C is commonly described as the general-purpose, object-oriented programming language adding Smalltalk-style messaging to the C programming language. Before Swift came into play, Objective-C had been the main programming language used by developers for OS X and iOS operating systems, and their APIs.


Swift, introduced at Apple’s 2014 WWDC, brought its own dose of revolution. In general description, Swift is a general-purpose, multi-paradigm, compiled programming language broadening the previous scope of operating systems as it was developed for iOS, OS X, watchOS, tvOS, and Linux. Swift was designed to enable work with Apple’s Cocoa and Cocoa Touch frameworks as well as the large body of Objective-C code already written for Apple products.


Initially Swift was intended to be more resilient and safer than Objective-C, and also more concise and developer-friendly. It was built with the LLVM compiler framework including in Xcode 6 and using the Objective-C runtime library that enables C, Objective-C, C++ and Swift code to run within one program.  Therefore, it enhaces broadening professional horizons for developers making their work more efficient.


That was the milestone when developers started their discussion of what is better, tradition or innovation.


tubik ios development


What is better: Objective-C or Swift?


Some time ago expressing our opinion in the hot global discussion about the choice between Photoshop and Sketch we mentioned: “The answer we would like to give is really simple. There is no any vs. There shouldn’t be any war between the options which can complement each other. Obviously, now there is no any perfect and ideal software for design: if it existed, everybody would use only this ideal choice and there wouldn’t be any need for fight.»


It seems that in iOS development the situation of today is really similar. The choice is not so obvious as it could seem even after reading about all the extended functionality of Swift in comparison with Objective-C. In practice Objective-C is checked and tested over the years while Swift is young and new. Huge bulk of products have been developed in Objective-C so transition to the other perspective is definitely taking some time and effort.


Briefly characterizing the programming languages according to her extended practical experience in iOS development, Tubik CTO Maria mentions that although Objective-C is older and common, Swift could be described as more simple in syntax and stable in work process.


Swift Objective-C development tubik


Which programming language is more useful to know?


Due to Xcode which is the integrated developing environment (IDE) with a set of software development tools iOS developers can work applying either Objective-C or Swift in fact using the same developer tool.


As long as Objective-C exists much longer, it’s natural that plenty of simple and complex applications have already been accomplished with this language. Not knowing Objective-C and starting straight from Swift can limit developer’s professional flexibility. It can be especially obvious in case when developers have to update existing products.


Sometimes it happens that developers, knowing only Swift, recommend to rewrite existing (perhaps big or even huge) piece of code from Objective-C to Swift, the customers logically do not see this acceptable and certainly do not accept the necessity to pay for this work.


Considering this, the best option is knowing both languages. That gives developers natural professional flexibility for any task and environment they have to tackle with in current projects. There are two strategies which mostly depend on the time available.


In case if there is considerable amount of time between studying basics and applying them into real practice, our advice is to start with Objective-C. Although it is often described as more complicated, it establishes a solid foundation of basic principles and routine of creating applications for and using iOS system. On this basis, learning another iOS language such as Swift which is syntactically simpler will not seem too hard.


However, there can be also another strategy, a bit more dynamic than the previous one and applicable for those who don’t have enough time in their disposal needing to start actual work asap. In this case, you can start with Swift as it is easier in syntax and more similar to other programming languages so it will take less time to start practical coding. Getting the basics of development in this way, don’t forget to add Objective-C to the practice and polish skills in both languages. It will definitely give result if approached thoughtfully and rigorously.


iOS development swift objective-c


Here in Tubik Studio we believe that the only single thing that a designer and developer should think about is the high quality of the final product. The highest. Quality. Possible. Period.


Any tool and method chosen for this aim is a good way as long as it provides the efficient product to the client and the final user.


Don’t miss our next articles on iOS development giving practical tips and case studies of coding complex design decisions.

Welcome to see designs by Tubik Studio on Dribbble and Behance