jargon in webdev

Our web development jargon

It is not always clear what we are talking about when we quote or about the development process. Therefore, here are some terms.

A collage of web development concepts and terms for a blog article. The image includes visual representations of various web development elements_ a m

At Code-on, we enjoy helping our customers. We know that IT jargon is often difficult to understand, so we try to keep it to a minimum. Still, it's helpful to know some common terms.

Here are some common terms:

Frontend:

The user interface of a Web site or application is called the frontend by developers. Programming the frontend affects how the site or application looks and how users interact with it.

Backend:

The underlying code of a site resides in the backend. When data is entered through the frontend, it must be stored in a database. This database is accessible when users request data. Before data is stored or retrieved, it often requires verification, processing and establishing relationships. This is typically backend work. "Backend" also often refers to the administrative part of the Web site, where site administrators, often called admins, work through a content management system (CMS).

MVP:

MVP stands for Minimum Viable Product. A Web developer often suggests building an MVP first, with only the minimum of features to test the essentials. This allows you to test the market and show investors that your business plan has potential. As you get more users, you can ask Web developers to add additional features.

SPA:

SPA stands for Single Page Application. When navigating to another page in an SPA, javascript requests the necessary data and elements from the server via an Application Programming Interface (API). The browser then renders the new page with this data. The advantage is that the application responds much faster and more interactively. A small new element does not require a full page reload. This shifts the focus to the frontend. SPAs have become popular in recent years, in part because Javascript has matured as a language. Code-on strongly believes in building SPAs and uses typical JavaScript frameworks such as Vue and Angular to do so.

MPA:

MPA stands for Multi-Page Application. This is the traditional way to develop an application. Unlike SPAs, with an MPA, the server builds and sends a new HTML page to the browser with each new user request. The advantage is a faster development process. With HTMX, you can obtain the same as with SPA.

API:

API stands for Application Programming Interface. It acts as a kind of connection point where data is usually displayed in JSON (JavaScript Object Notation) format. The API allows this data to be read and displayed in a readable format in the browser. The development of SPAs usually requires an API first.

Headless:

Headless means that the administrative part of a site is separated from the front end. For example, a headless CMS always results in an API. An existing API can be used to build an SPA application, which can then be placed on different or multiple URLs.

JSON:

JSON stands for JavaScript Object Notation. It is a standardized data format used for data exchange.

Framework:

Frameworks simplify the development process. Although they are not essential for software development, building software without a framework would require a lot of effort, since a framework already contains many solutions and best practices. Code-on uses several frameworks, such as Django, Django REST, Django-Ninja, Vue.

Unit Tests:

Unit tests are tests written programmatically. When your code changes, these tests test whether the new code still produces the expected results. For example, they detect errors when the data expects a number but suddenly accepts a letter. That's how developers know they've made a mistake.

Git Repository and Version Control:

Git is a version control system. When a programmer writes a piece of code, he submits it to a repository. Every change is recorded there. Thus, one can always track who wrote a particular piece of code and when, and if necessary, one can restore the old code. Git has become the de facto standard in the IT world.

SSL:

SSL stands for Secure Socket Layer. It is a protocol for encrypting data exchanged between the server and the browser (client) so that it cannot be read by others. You can recognize this by "https://" in the URL bar. It is standard nowadays to provide your website with SSL, which can be done for free with Letsencrypt and is beneficial for your SEO.

An illustration depicting various concepts in web development and programming. The image is divided into different sections, each representing a key t

UI design:

UI stands for User Interface. Designers and front-end engineers work on this to facilitate interaction with a computer. The UI design determines how you communicate with the computer and application.

UX design:

UX stands for User Experience. This involves questions such as: How easily can a user interact with the application? Is a task frustrating? Can the user experience be simplified? What about conversion? UX design focuses on making the application user-friendly.

Lo-fi Design:

Lo-fi design is a sketchy elaboration of a design. It focuses on functionality and gives a general idea of what is to be built. This is often accompanied by wireframes.

Wireframe:

Wireframes are sketches of an application. They do not show the final design, but focus on functionality. An entire application can be represented with wireframes. So they are more about functionality than aesthetics.

Hi-fi Design:

Hi-fi design is the stage where all the wireframes come together to form a finished design. This is where the application is fully detailed. UI and UX come together here in defining the design, including colors, fonts, buttons, menus, widgets, etc.

Widget:

A widget is a small element within an application, often used to indicate a specific functionality. An example of a widget is a sidebar that indicates how many hours you have worked.

Responsive Design:

With responsive design, front-end engineers and designers ensure that everything on a page adjusts to remain readable on any screen size, including smartphones. This also applies when a browser window is enlarged or reduced in size. For example, elements that appear in the same row on a widescreen screen may be stacked vertically on a mobile device.

CSS:

CSS stands for Cascading Style Sheets. With these, the front-end developer describes how the application should look. In CSS, for example, you can specify that an H1 title should be 22 px in size. Then, when you place an H1 title in the HTML of your site or application, it will be the specified size.

Above the Fold:

This term originally comes from the newspaper industry. In web design, "above the fold" means that the most important content is visible without scrolling down. This also takes into account different screen sizes, from ultra-wide screen to smartphones.

Web development uses a lot of jargon. These are some of the most common terms you will encounter when working with a developer. If you have any let me know and I'll put it here.