If you're just starting out with web development chances are you'll be soon overwhelmed with tech jargon. You'll begin to ask yourself "what is AJAX?", "What is an API"?
Expert developers know them all, but you shouldn't feel bad for not having any clue about a "transpiler". Here's a little glossary for helping you out!
If you feel the urge to yell at me in the comments read this first. Enjoy!
AJAX: a set of technologies for fetching data in the browser without causing a page refresh. The acronym stands for "Asynchronous JavaScript and XML", coined in 1999.
API: stands for Application Programming Interface, but don't bother the strict definition for now: an API in programming is a set of tools, a toolbox of functions (also called methods), built by other developers and ready for use. With time you'll learn how the term has slightly different meanings depending on the context.
Native API: a native API is a built-in tool available by default in a programming environment. Speaking of browsers for example we say that
document.querySelector()
is part of the native API for selecting HTML elements.Browser console: in most web browsers you can access a developer toolbox. In Firefox and Chrome on Mac press Command + Option + I, on Linux (and Windows if I can recall) press F12. That will open a interactive console where you can type and execute JavaScript code. The console will also show errors and other messages from your JavaScript programs.
Debugger: debuggers are tools built for helping developers to find why and where a program stops working. In JavaScript there is also the
debugger
instruction which stops the script exactly where it's placed.Browser API or Web API: like native APIs a Web API is a specific functionality available in a web browser. Developers can use these methods out of the box. Examples of Web API are
setTimeout
,setInterval
,console
. For a complete list check out Web APIs.ECMAScript: it is a standard from which JavaScript has been implemented. It could also be used as the "official" name for JavaScript. In 1996 JavaScript was donated to ECMA international, a third-party entity which takes care of defining standards for a lot of technology related things.
ES5: acronym for ECMAScript 2009, the fifth version of JavaScript. To avoid confusion it's more correct to say ECMAScript + year for denoting a specific JavaScript version.
ES6: stands for ECMAScript 2015, the sixth version of JavaScript. Since 2015 the JavaScript committee decided to release new features yearly. From there we had ECMAScript 2016, ECMAScript 2017, ECMAScript 2018, and so on.
JavaScript engine: is part of the browser and is able to compile and interpret JavaScript code. Browser vendors build JavaScript engines by following (sometimes not so strictly) a document called JavaScript specification.
JavaScript specification: is a formal, written document which outlines how the JavaScript language should behave. Browser vendors read the spec and implement JavaScript engines in a way that JavaScript code is executed as the spec prescribes.
Node.js: an environment for running JavaScript outside of the browser. It includes a JavaScript engine, V8, for compiling and executing the code. Node.js is mostly used on the server-side and for command-line tools.
Node package manager: npm in short, is a tool for managing the workflow of JavaScript projects, from installing third-part packages to shipping code.
HTTP request: is the act of "talking" to a remote web server (also called web service) for fetching or saving data. An example of HTTP request is when you visit some web page with a browser. Web pages in turn can make HTTP requests too for fetching data, mostly to REST APIs (see below). While a web service is not the same thing as a web server, there is always some kind of server listening for connections behind a web service.
HTTP error: sometimes things don't go well when talking to web services and the server may respond with an error. Errors are denoted with a numeric code: some common errors are 500 (server error), 404 (not found), 403 (forbidden), and so on.
JSON: JSON stands for JavaScript Object Notation, a format for exchanging data between web service and web applications, yet not limited only to them.
REST API: is a web service (local or remote) which can expose data. Web applications (and any kind of application in general) can make HTTP request to a REST API for interacting with an underlying database, or simply for sending commands to the system.
Transpiler: older browsers do not support modern JavaScript syntax from ECMAScript 2015 and beyond. A transpiler is a tool which takes modern JavaScript syntax and spits out a more compatible version (ECMAScript 2009).
Proposal: JavaScript innovation is fueled by a group of developers and academics forming a committee, called TC39. Members of the committee can submit proposals for improving and adding new features to the language. A proposal is a formal description outlining what the new feature does and how it'll be used in JavaScript.
Stage N: new JavaScript proposals always start at stage 0. The more the proposal is voted by the committee, the more it advances to the next stages: 1, 2, 3, and 4. Every time you read "stage 1" or "stage 2", it's the stage at which the proposal is currently in. A proposal at stage 2 for example means it is doing fairly well and it will most likely move forward to the next stages. The final stage is 4, meaning that the new feature will land into the language.
Vanilla JavaScript: vanilla JavaScript is a term for denoting "pure" JavaScript applications, i.e. those written without the help of a frontend library like React, Vue, or Angular.
XMLHttpRequest: it is a native object available in browsers for making HTTP requests to remote resources. XMLHttpRequest is part of the AJAX family, a set of technologies for fetching data in the browser without causing a page refresh.
Fetch API: it is a native API for making HTTP requests, much like XMLHttpRequest, but based on ECMAScript 2015 Promises. It is considered the successor of XMLHttpRequest, yet builds on top of it.
CORS: acronym for Cross-Origin Resource Sharing. It is a way for browsers to give access to a given domain, for instance b-example.dev to resources living on a different domain, ie. a-example.dev. By default browsers block HTTP requests to remote resources originating from objects like XMLHttpRequest.
WebSocket: it is an internet communication protocol which provides a mean to communicate in both directions over a single TCP connection. With a WebSocket, client and server can talk to each other in real time, like they were involved in a telephone call: once connected, a client will be able to receive data from the server, without any need to continuously "refresh" the connection. On the other hand the server will also be able to receive data in real time from the client inside the same connection. WebSockets are mostly used for chat and real time applications.
SQL: acronym for Structured Query Language. Although SQL leans more on the backend, a basic understanding of SQL is always nice to have. SQL is a language for interacting with databases. With SQL you can create databases, tables, and build complex instructions for querying and modifying data. An example of SQL is
SELECT * FROM table_name;
.GraphQL: GraphQL is a query language for interacting with data sources. GraphQL leans more on the frontend and offers great flexibility over the classic REST approach for fetching and saving data.
Want to add something? What's missing? Let me know in the comments!
Top comments (27)
A few other terms I would suggest, since they are becoming more and more common:
will do!
Nice! Maybe to add Cross-Origin Resource Sharing (CORS)
will do, cheers
Please explain what's that
By default, browsers doesn't allow a domain to get or make calls to domains outside, cors enables that share between domains :)
Can you offer constructive criticism and show us a proper definition for Native APIs?
Google it
Do you have any problem with the stuff I write George?
dev.to/dexygen/comment/jgcc
If so try to offer constructive criticism instead.
Happy holidays.
If that's all you're arguing about; querySelector is part of an API because the function doesn't do just one thing but different things depending on the string passed. It's an API to access the elements in the DOM. Sure we can "Google" and find someone explaining it differently, but OP's explanation has nothing wrong about it and you're being very harsh by saying things like that.
A function doing different things based on the string passed does not make that function anything close to an API. And you, an intern, arguing with me, with 20+ years development experience, is laughable, especially because your argument isn't even close to being correct.
You using people's status to validate your point is laughable. You can say all you want about your 20 years experience but it has literally no value in this argument. Use that experience to make better points instead of just saying everyone is incorrect because a single thing doesn't fit exactly your understanding.
Didn't read your reply, and won't be reading any more of them. If you don't like my replies, flag them. Or more constructively, give the following a read: dev.to/dexygen/dev-to-posts-tagged...
@simon Landry
Like you wrote querySelector is part of API, nobody objects to this. But is not The API.
I hope you are not claiming that the Document object what exposes the querySelector method has 30+ APIs, one for each method. All those methods are part of the same API. Generally speaking: one API -> many objects with many methods.
2 An API is not a toolkit, just a collection of methods to access an application.
Method in this context is not the OOP term for methods of objects, but means any method, i.e. could be an HTTP call, invoking a function exported by a Windows dll or an RPC call. Applications can be both remote and local and this is important to mention because some people think APIs are for remote web servers only.
"a set of tools, a toolbox which is built by other developers and ready for use" is an SDK (Software Development Kit), although sometimes framework term is also used in this context.
6 Web API can also refer to APIs available through web (i.e. HTTP) and I have a feeling that this meaning is more common.
en.wikipedia.org/wiki/Web_API#Serv...
docs.microsoft.com/en-us/aspnet/we...
7 ECMAScript is not an official or alternative name for JavaScript but a standard. JavaScript is only one of the implementations of this standard, even if there are no other notable implementations left.
12 Is node.js used on client side at all?
14 I wouldn't treat web server and web service terms the same. Web servers are typically serving web pages for humans, web services are typically providing services for other services or applications through web. Any service is typically for machine use.
16 JSON can be used in any data interchange, is not limited to web applications or web in general.
17 REST API is definitely not limited to exposing data, it is widely used to execute commands and create data too. Although in many cases there is a database in the background it is not correct to state that a REST API is for interacting with a database.
A REST or RESTful API is an arbitrary API with very specific requirements like has to be stateless. Unfortunately many developers are too ignorant to look up the definition and call any HTTP API REST and this sometimes leads to confusion.
18 Your definition is a very limiting subset of what a transpiler is: a tool what transforms source code to source code in another programming language (translating compiler). A typical example is TypeScript compiler (tsc) what takes TS source code as input and outputs javascript source code, despite being called compiler. The input and output languages and versions are irrelevant, in fact many transpilers can consume and produce different versions of the same language.
19 RFC is a must mention term.
21 Like others mentioned it should be pointed out that vanilla means light, basic in programming terms.
22 XHR is a must mention here.
24 Isn't really the browser what gives permission but the web server and the browser blocks or restricts access based on permissions acquired from the server.
25 Since websocket support has become almost omnipresent it is used in any scenario where server side notifications have to be sent to clients (push notifications) because polling is rather expensive. I.e. Gmail and other web email clients use websocket despite not doing chat or real time.
26 With the rise of Web SQL SQL is no longer a server side language. NoSQL is a must mention on this topic, especially since we have IndexedDB in browsers.
27 GraphQL is a query language but is nothing like SQL. It is in fact somewhat similar to NoSQL what itself is very different to SQL.
You are very enthusiastic what is not a bad thing except when is not backed by proper knowledge. It would also help to ask someone to proofread before publishing, both linguistically and technically. Would be nice (technically mandatory) to provide the source for your quotes, i.e. a link to original. Examples help too. Links to relevant definitions, articles add lot of value.
I appreciate your notes and I adjusted the post a bit. But don't assume anything about me just because here I used some definitions loosely, on purpose.
It's true that we ought to be rigorous when teaching stuff to beginners, but I don't think people is "ignorant" like you said.
I feel like number 15 should be changed to be about HTTP response codes in general (of which the 4xx and 5xx error codes are a subset of) rather than just error codes. Otherwise a beginner might think that all response codes are error codes (which would be wrong).
Number 14 should probably be clarified too..."machine-machine" is ambiguous. My phone (machine) runs a browser that makes HTTP requests to a server (machine), most of which are not exhcnaging JSON data. I think what you really mean is frontend to backend communication exchanges JSON usually? And are trying to distinguish that from browser web page requests? Anyway, I think that phrase should be clarified as it's a bit broad!
I changed #14 a little bit. Let me think about #15. Cheers
Web Worker, an API that work like background processed your statement. Web worker usecases mostly on heavy load fetching a ton of data from REST / GraphQL for plotting a graph, and when you want to make an autosaving input, etc.
Gold!!
I think Vanilla anything should be added. E.g. Vanilla PHP means PHP without using frameworks such as Symphony or Laravel.
Stock is also synonymous to Vanilla in this context
Wish I could share this with a friend .. basic and simple to understand
The easiest way would be to copy/paste
Contrary to popular belief, "npm" does not stand for "node package manager". It actually stands for..... Nothing. The three letter have no official significance.
Some comments may only be visible to logged-in visitors. Sign in to view all comments.