61 Frontend Web Development Buzz Words every Developer Should have in their Vocabulary
Tags: javascript, webdev, html, css
Published: 2022-05-29 06:49:45

Don't want to feel left out when your friends discuss **Frontend Web Development**? Here is a list of **61 Buzz** words to make yourself look cool (right from basics to advanced ones) in **Alphabetical Order**:

### 1. API

Short for **“Application Program Interface”**, how computers and applications communicate with one another.

### 2. Application

Often abbreviated to “app”, these are programs designed to perform functions. Might refer to **desktop**, **mobile** or even **web apps**.

### 3. Attribute

**Attributes** are special words used inside the **opening tag** to control an **HTML Element's behavior**

### 4. Breakpoint

No, it is not the point where you feel like breaking everything...

![breaking-computer](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n5ws3roqi2y7q233ksa6.gif)

These are **points** when your website will **adjust to accommodate the screen size** to make sure the **user has the best experience viewing the website** at that size.

### 5. Browser

The program you use to access the Web — such as **Chrome**, **Firefox**, or **Safari**.

### 6. Bootstrap

Depending upon the context:

- **Bootstrap** refers to a **free, open-source frontend framework** for designing websites and web apps

- Initializing a project (Eg: “This app was bootstrapped with `create-react-app`”)

### 7. Bug

An **error** or **flaw** in the website or app that keeps it from running as expected.

![bug](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/v8s4kjpa8hquw7jltaxl.jpg)

### 8. Cache

**Cache** is **temporary data storage** that helps site speed by **storing relevant information** on your computer the first time you visit a website. Thanks to **cache**, when you visit the website again, your computer **does not have to reload all the website information** as it's already saved.

### 9. CI/CD

**CI/CD** is a method to frequently deliver apps to customers by **introducing automation into the stages of app development**. The main concepts attributed to **CI/CD** are **continuous integration**, **continuous delivery**, and **continuous deployment**. **CI/CD** is a solution to the problems integrating new code can cause for development and operations teams

### 10. Cookies

![cookies](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/c68m75bzqx3c5deq90fs.gif)

Nope, we are not talking about the source of all that is **good**, **chocolatey**, and **sugary** in the world...

It is the data sent by an **Internet server** to a browser. Each time the browser accesses the same server, it sends the data back as a **means of tracking** how (and how often) it accesses the server.

### 11. Crawl

This is the process used by **search engines** that involves sending a bot to your website to **gather information** on pages that exist and no longer exist and update their **database** on the information it has gathered. It is necessary to get **indexed** by **search engines** and get found.

![crawl](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/mi35pfch5ygc9qw9o4ln.gif)

### 12. CSS Selectors

A **CSS selector** selects the **HTML elements** you want to style. The commonly used selectors use **HTML classes**, **IDs**, and **tags**; but there are a plethora of **complex selectors** that can be used to granularly select elements.

### 13. CSS Property

Characteristics that are dictated by **CSS** such as **color schemes** and **fonts**.

### 14. CTA

Short for **Call to Action**. These are elements (generally buttons) on your website that **drive certain conversions or goals** such as **donations**, **newsletter signups**, or **user registrations**.

### 15. Debugging

Remember those **bugs** we talked about? Well, debugging is the process of **identifying** and **dealing with them**.

![debugging](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ad1575hfakuwbxpodzwy.gif)

### 16. Deployment

**Deployment** is a combination of all of the activities that **make a software system available for use**.

### 17. Documentation

**Documentation** is essentially the **central point of reference** for anyone involved in **managing**, **maintaining** or **using a website** or **piece of software** and provides information on **requirements**, **architecture and design**, **technical properties**, information for the end user.

### 18. DOM

The **Document Object Model** is a **cross-platform** and **language-independent** interface that treats an **XML** or **HTML** document as a **tree structure** wherein each **node** is an object representing a part of the document. The **DOM** represents a document with a **logical tree**.

### 19. Domain

The **address** for a website is entered into the browser.

### 20. Favicon

Short for **“favorite icon”**, it’s the icon that appears in your website’s browser tab.

### 21. First Contentful Paint

Abbreviated to **FCS**, it measures how long it takes the browser to **render the first piece of DOM content after a user navigates to your page**

### 22. Fields

![fields](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/zjtwztshd4t0vctrp7mk.png)

The most **basic of the building blocks for data collection**. These are the storage units that your website visitors use to enter their names, email addresses, notes, etc.

### 23. Fold

Above the **fold** is also used in website design to refer to **the portion of the webpage that is visible without scrolling**. As screen sizes vary drastically there is no set definition for the number of pixels that define the **fold**

### 24. Framework

**Frameworks** were invented to make the process of building a website faster and easier. You can think of a **framework as a collection of solutions, tools, and components that you can access in one central location** — rather than seeking them all out separately each time

### 25. Git

**Git** is a **version control system** where developers can store and manage their code.

### 26. GitHub

**GitHub** is a **cloud interface for Git**, which also offers its own features, such as **bug tracking**, **task management** and **project wikis**

![github](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/sn4j8f0bon9ksx1auji3.png)

### 27. Hex

**Hex color** codes are the most commonly used **color-coding system** that provides values that tell the display how much of a color to show.

### 28. HTML

**“Hypertext Markup Language”** The coding language used to build a website in terms of both form and function.

### 29. HTTP

**Hypertext Transport (or Transfer) Protocol**, the data transfer protocol used on the **World Wide Web**.

### 30. HTTPS

Basically the same as **HTTP**, but uses **encryption** methods to secure the data passed to and from webpages.

![https](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ac5g6ee4hlh13hjcai11.png)

### 31. iFrame

**HTML element** used to **embed a website within another website**.

### 32. JavaScript

**JavaScript** is a **client-side language**, which web developers use to **add automation**, **animations**, and **interactivity** to web pages

### 33. Largest Contentful Paint

**Largest Contentful Paint (LCP)** is a **performance metric** that measures how long it takes for the **largest content element to be rendered** on the screen.

### 34. Libraries

A **library** is a **set of modules** which makes sense to be together and that can be used in a program or another **library**. A **package** is a unit of distribution that can contain a **library** or an executable or both.

### 35. Light House

**Lighthouse** is an **open-source**, **automated tool** for **testing** and **improving the quality** of web pages

![lighthouse](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/2pwqxeu0nilozfqgwogd.gif)

### 36. Meta Tag

Additional information on web pages or elements, such as the way a piece of content should display in **Google search results**, the photo credit for an image, etc.

### 37. Minification

**Minification** is the process of **minimizing code and markup** to **reduce the file size**. When creating an **HTML** file, for example, developers will most likely use **spacing**, **comments**, and **variables** to make the code more readable as they work with it. To minify the code once the webpage is ready to go live, developers will remove these **comments** and **spaces** to ensure a **quicker page-load time**

### 38. Mobile-first

**Mobile-first** is an approach to web design and development that **prioritizes mobile devices**. Rather than building a website with a desktop in mind and then considering how it might look on a mobile device, with a **mobile-first** approach, the website is first built for the small screen.

![types-of-design](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/ydaggh6xeh87rlrxu9sa.jpg)

### 39. MVP

Short for **Minimum Viable Product**, refers to the most **pared-down version of a product** that can be released to the market.

### 40. Navigation

**Links** on a website that points to the other pages. Generally found in the **menu** at the top of a site or in a **footer**

### 41. NPM

The default **package manager** for the **JavaScript runtime environment Node.js**

### 42. Opening/Closing Tags

Angle brackets (`<>`) that bookend an **HTML element** to help build the structure of a webpage. Closing tags include a forward slash (`</>`).

### 43. Promises

![promise](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w6rdvgcq47qa9zjtggca.gif)

The **Promise** object represents the **eventual completion (or failure) of an asynchronous operation** and its resulting value.

### 44. Redirects

A **redirect** is when a web page is visited at a certain **URL**, it changes to a different **URL**

### 45. Resolution

**Resolution** is a metric used to describe the size of an image or a screen.

### 46. Responsive Design

**Responsive design** ensures that a website is displayed correctly no matter what device the user is viewing it on.

### 47. SAAS

**Software as a service (or SaaS)** is a way of delivering applications over the **Internet** as a service.

### 48. Search Engine Optimization

![seo](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/8zmbdxvdd52vken05wuk.png)

Abbreviated as **SEO**, it is the process of **creating** and **modifying content** for the **best visibility** on **search engines**.

### 49. Semantic HTML

**Semantic HTML** is the use of **HTML** markup to reinforce the **semantics**, or meaning, of the information in webpages and web applications rather than merely to define its presentation or look

### 50. Server

Computers running software that allows users to access your website and houses the **hosting**

### 51. Server-Side Rendering

**Server-side rendering (SSR)** is an application's ability to convert **HTML** files on the server into a fully rendered **HTML** page for the client.

### 52. Sitemap

**Outline of all pages** on a website, organized in **hierarchical order**

![map](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/buwlet25pbobyq7gatqr.jpg)

### 53. Slider

A **Slider** is a **Carousel** generally consisting of images or cards that rotate, highlighting different photos, links, and content.

### 54. SVG

The representation of a digital image as **rectangles**, **lines** and other **geometric entities**, resulting in the image being **scalable to any size**.

### 55. TypeScript

A **strict syntactical superset of JavaScript** and adds optional **static typing** to the language.

### 56. UI

**UI** is the interface of interaction between the visitor and a computer.

![ui-mockup](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/4nsu60xep2h0jz9z6d5n.jpg)

### 57. UX

A user’s interaction with the **UI** with a focus on how satisfying and successful the experience is.

### 58. Widgets

A relatively simple and **easy-to-use software application** or **component** made for one or more different software platforms.

### 59. Wireframe

A visual guide to show the **structure** and **content of a web page** without any design elements. This helps to focus on the **layout of content** and **hierarchy**, without being **distracted by design**

### 60. WYSIWYG

Stands for **“What You See is What You Get”**. It is a visual content editor that allows you to modify content as **Rich Text** (text with formatting)

### 61. Yarn

**Yarn** is a package manager just like **NPM** that doubles down as a project manager.

Finding **personal finance** too intimidating? Checkout my **Instagram** to become a [**Dollar Ninja**](https://www.instagram.com/the.dollar.ninja/)

# Thanks for reading

Need a **Top Rated Front-End Development Freelancer** to chop away your development woes? Contact me on [Upwork](https://www.upwork.com/o/profiles/users/~01c12e516ee1d35044/)

Want to see what I am working on? Check out my [Personal Website](https://tapajyoti-bose.vercel.app) and [GitHub](https://github.com/ruppysuppy)

Want to connect? Reach out to me on [LinkedIn](https://www.linkedin.com/in/tapajyoti-bose/)

Follow me on [Instagram](https://www.instagram.com/tapajyotib/) to check out I am up to recently.

Follow my blogs for **Weekly new Tidbits** on [Dev](https://dev.to/ruppysuppy)

**FAQ**

These are a few commonly asked questions I get. So, I hope this **FAQ** section solves your issues.

1. **I am a beginner, how should I learn Front-End Web Dev?**
   Look into the following articles:

    1. [Front End Development Roadmap](https://dev.to/ruppysuppy/front-end-developer-roadmap-zero-to-hero-4pkf)
    2. [Front End Project Ideas](https://dev.to/ruppysuppy/5-projects-to-master-front-end-development-57p)

2. **Would you mentor me?**
   Sorry, I am already under a lot of workload and would not have the time to mentor anyone.