フロントエンドとは

フロントエンドは、Web サイトやアプリケーションのうち、利用者が直接目にして操作する画面の部分のことです。サーバー側で処理を担う バックエンド と対になる言葉です。

主な技術

• HTML：ページの内容と構造
• CSS：見た目やレイアウト（レスポンシブ 対応など）
• JavaScript：動きや操作への反応、API からのデータの取得
• React・Vue.js などのフレームワークや、SPA の仕組み

主な役割

• 画面の表示とレイアウト
• フォームの入力や、ボタンなどの操作への反応
• 表示の速さや使いやすさ（アクセシビリティを含む）の改善
• バックエンドの API とのデータのやり取り

セキュリティ上の注意

• ブラウザーで動くコードは、利用者が中身を見たり書き換えたりできる。APIキー などの秘密の情報を置かない
• 入力チェックは使いやすさのためのもので、安全のための確認はバックエンドで必ず行う
• 外部から受け取った文字列を画面に出すときは エスケープ し、XSS を防ぐ
• 読み込む外部のスクリプトや パッケージ が改ざんされる危険にも注意し、CSP で読み込み元を制限する

関連用語

バックエンド、DOM、SPA、XSS