前書き
この記事では駆け出しフロントエンジニアが覚えたい用語について一言でまとめてあります。
「Babelって聞いたことあるけどどういう意味だっけ？」
「ES6の記法をES5以前の記法に直してくれるのってトランスパイラだっけ・・・？コンパイラ・・・？」
のように単語と意味が合致してない人が思い出せたり、記憶を定着させるように作成しました。
思い出したい時に見てもらえるといいかもです！
用語集
HTML
Webページを構成するための言語。タグで文章を囲むことでテキストにリンクを付けたり文字を強調させたりすることができる。
CSS
HTMLで作られた文章に色を付けたり文字サイズを変更したりと装飾をする言語。
JavaScript
アニメーションを付けたりサーバーから情報を取得できたりと動的なWebページを作るのに使用される言語。ブラウザで動かすことができる。
TypeScript
JavaScriptに型をつけた静的型付け言語と呼ばれ、開発中にエラーを出してくれるため安全に開発することができる。
jQuery
JavaScriptを簡単に記述できるように作られたライブラリ。Web制作会社ではよく使われているが、モダンなWeb系企業では使われていない。
Node.js
JavaScriptでサーバーサイドを扱えるようにした言語。
React
Facebook社(現Meta)が開発したUIを構築するライブラリ。ページを更新した際に差分を検知してその差分のみを変更するため表示を切り替えるのが高速でできる。SEOに弱い。
SPA
Single Page Applicationの略。一度訪れたページから別のページに遷移をすることなく、同一のページ内でコンテンツのみを切り替えるアプリケーション。
Next.js
Reactのフレームワーク。サーバーサイドでレンダリングするためSEO的に有利になったりスペックの低いPCでも早く表示できるようのが特徴。
サーバーサイドレンダリング(SSR)
ReactやVueで作られたWebページはブラウザでHTMLをレンダリングするが、サーバーサイドレンダリングはサーバーでHTMLをレンダリングする。
クライアントサイドレンダリング(CSR)
ReactやVueでWebページを作る際にブラウザでレンダリングすること。
コンパイラ
プログラミング言語で書かれたものを機械語に翻訳すること。
ビルド
ソースコードにバグがないかを解析し、問題がなければ実行できる形のファイルに変換すること。
デプロイ
開発したアプリをAWSやサーバーに公開することで誰でも利用できるようにすること。
トランスパイラ
とあるプログラミング言語を別の言語に変換すること。例)ES6で書かれたJavaScriptをES5以前のものに変換する
Babel
ES6で書かれたJavaScriptをES5以前のものに変換するツール。Internet Explorer11等の古いブラウザではES6の記法では動作しないためES5に変換する必要がある。
Webpack
複数のファイルをよしなに一つのファイルにまとめてくれるツール。主にJsファイルをまとめる時に使われる。
npm
Node Package Managerの略。Node.jsのパッケージを管理するツール。
API
Application Programming Interfaceの略。特定の機能を公開して、外部のソフトウェアからでも同じ機能を共有できるようにしたもの。
Prettier
コードを整形してくれるツール。
ESlint
JavaScriptやTypeScriptなどの静的解析ツール。構文エラーを検知したり、独自のルールを設定できるためコードの綺麗にできる。
UI(ユーザーインターフェース)
User Interfaceの略。サイトの見た目や使いやすさのこと。
UX(ユーザーエクスペリエンス)
User Experienceの略。サービスを通してユーザーが得られる体験のこと。
まとめ
最後までご覧いただきありがとうございました！
僕もまだまだ駆け出しエンジニアで覚えることが山ほどあります
そんな僕と一緒に成長してくださる方がいれば是非、Twitterをやっているのでつながりましょー！
フォローしてくださったらメッセージもらえると嬉しいです！