2026年8月、初めてAIハッカソンに参加した。
そのとき初めて見た言葉で印象的だったのが、「フロントエンド」と「バックエンド」。
えっ、何それ？
ハッカソン当日のお昼ごろ、チームづくりのために、自己紹介やメンバー募集を書き込むスライドが共有された。そこには、自分の職種や得意分野を書く欄があった。
「バックエンド担当」「バックエンドが中心で、フロントエンドはあまり得意じゃない」など、見慣れない言葉が並んでいる。
ほかにも「なんとかディレクター」とか、知らない肩書きがいっぱい。SEぐらいは知っていたけど。（笑）
AIやアプリ開発の世界では、みんな当たり前のように使っている言葉らしい。
でも、私には初めての言葉！
それから約2か月。
今度はベトナム人AIエンジニアと2人チームを組んで、国際AIハッカソンに参加することになった。
そして、チームメンバーが作ってくれたIdea Proposal（企画提案書）には、なんと私の担当として「フロントエンド」と書かれていた。
ちょっと待って。
2か月前まで、その言葉の意味も知らなかったんだけど！（笑）
今回は、非エンジニアの私がハッカソンで出会った「フロントエンド」と「バックエンド」について、実際の経験と一緒に整理してみるよ。
初めてのAIハッカソンで知らない言葉に出会った
私が初めて参加したのは、2026年8月の AIAU Craft Day。
AIを使った開発に興味はあったけれど、エンジニアとして働いた経験はない。
それでも、すでにAIの力を借りて自分でアプリを作ったりしていたので、参加してみた。
実際に参加すると、聞いたことのない技術用語がいろいろ出てくる。
その中の一つが、フロントエンドとバックエンドだった。
最初は、どう違うのかもよく分からなかった。
でも、ハッカソンではチームで一つのものを作るから、誰がどこを担当するのかという話になる。
そういう場面で、この二つの言葉が重要なんだと少しずつ分かってきた。
フロントエンドって何？
簡単に言うと、ユーザーが直接見たり、操作したりする部分のこと。
例えば、Webアプリを開いたときに見える画面。
ボタン、入力欄、メニュー、文字、画像など。
「ここをクリックしたら、次の画面が開く」
「入力した内容が画面に表示される」
そういう、ユーザーとアプリが接する部分を作るのがフロントエンド。
ただし、ここで一つ注意したいことがある。
フロントエンドとデザインは、同じ意味ではない。
色やフォント、画面のレイアウトを考えるのはUIデザイン。
そのデザインを実際にブラウザ上で動く画面として作るには、プログラムの実装も必要になる。
つまり、見た目を考えることと、見た目を実際に動かすことは、関連しているけれど別の仕事でもあるんだね。
じゃあ、バックエンドは？
バックエンドは、画面の裏側で行われる処理を担当する部分。
例えば、画面で何かを検索するとき。
検索する言葉を入力して、ボタンを押し、結果を見る画面はフロントエンド側。
一方、入力された言葉を受け取って、必要な情報を探し、結果を返す処理はバックエンド側で行われることがある。
データベースから情報を取り出したり、保存したり、外部のサービスと通信したりするのも、バックエンドの仕事になることが多い。
もちろん、実際のアプリでは仕組みによって役割の分け方も変わる。
でも初心者の私には、まず、
フロントエンド＝ユーザーが触れる側
バックエンド＝裏側で処理する側
と考えると、イメージしやすかった。
身近な例で考えると、レストランのネット予約
例えば、レストランをネットで予約するとき。
スマホでお店を選んで、日付、時間、人数を入力する。
そして「予約する」ボタンを押す。
このとき、自分が見たり操作したりしている画面が、フロントエンド。
じゃあ、バックエンドは？
予約ボタンを押すと、画面の裏側で、その時間に席が空いているか確認したり、予約情報を保存したりする。
そして、予約ができたかどうかを画面に返してくれる。
こういう処理を担当するのがバックエンドなんだね。
もちろん、実際の仕組みはサービスによって違うけれど、こう考えると分かりやすい。
画面で操作する部分と、その裏側で処理する部分。
普段何気なく使っているサービスも、フロントエンドとバックエンドが連携して動いているんだ！
なるほど。今までそんなことを考えて予約したことなかった！（笑）
そして国際AIハッカソンでは、自分がフロントエンド担当に！
2026年10月、今度は Vietnam Japan AI Hackathon 2026 に参加。
ベトナム人AIエンジニアと2人チームを組んで、Amazonセラー向けのAI Agent、FrostLoop AI を作ることになった。
実際のAmazon業務で使っているCSVを共有すると、チームメンバーは約3時間でAgentの大部分を作って見せてくれた。
技術的な実装は、基本的にチームメンバーが担当。
私はAmazonセラーとしての業務知識や、ビジネス側の考え方を担当した。
そして、もう一つ。
画面の色やフォント、UIのデザインの部分は、自分が調整したいと伝えたんだ。
その後、Idea Proposalには自分の役割として「フロントエンド」と書かれていた。
おおっ！ チームメンバー、すごくやさしい。私ができるのはまだ一部分だけなのに、担当にしてくれている。
1回目のハッカソンで初めて知った言葉が、今度は自分の役割に！
これには、ちょっと面白い気持ちになった。
でも、フロントエンドの全部を作れるわけじゃない
ここは誤解しないように書いておきたい。
提案書にフロントエンド担当と書かれていても、私がフロントエンドのプログラムを全部一人で実装できる、という意味ではない。
GitHubを使った共同開発も、まだ勉強しているところ。
私が実際に進めていたのは、例えばこんなこと。
- プロジェクトのロゴ画像を作る
- 動きのあるロゴを作る
- ロゴに合った色の組み合わせを考える
- UIの見た目や配置について提案する
- 画面に使う画像を作る
- キャラクターや短い動画を作る
- 操作したときに表示するポップアップ用の画像を作る
でも、これってフロントエンドの仕事の中では、ごく一部なんだよね。
フロントエンドには、見た目を考えるだけでなく、実際にコードを書いて画面を作ったり、ボタンを押したときの動きを実装したり、バックエンドから受け取ったデータを画面に表示したりする仕事もある。
スマホとパソコンで画面が崩れないように調整したり、キーボード操作なども含めて誰でも使いやすくしたり、表示や動作をテストしたりすることも大切。
私が主に関わっているのは、色、フォント、配置、画面構成、画像やアニメーションなど、ビジュアルに関わる部分。
作った素材を実際の画面に組み込んで、操作に合わせて動かすには、さらにプログラムの実装が必要になる。素材を作ったことと、機能として動くようにしたことは別なんだ。
つまり、フロントエンド担当とは書いてもらったけれど、私ができるのはまだ、その中のほんの一部分。
でも、チームで作るなら、全部を一人でできなくてもいいんだよね。
自分ができる部分を担当して、できない部分は得意な人と協力する。
そういう参加の仕方もあるんだと思った。
私は普段からAmazonで自分のブランド商品を販売していて、ロゴや商品画像、パッケージなど、視覚的なデザインの部分は自分で作ってきた。
そのブランディングの経験が、ここでも役立つかもしれない。
技術のすべてを理解していなくても、自分の得意なところで参加する方法があるんだと思った。
ちょっと思い出したこと。以前、Webデザイナーと話をしたことがある。
私は「Webデザイナー」というから、Webサイトを全部作る人だと思っていた。でも話してみると、その人はコーディングなどは担当せず、画像のパーツを作っているようだった。
最初のイメージとは大きく違ったけれど、同じWebデザイナーという肩書きでも、人によって担当する仕事の範囲が違うんだと知った。
今回の「フロントエンド担当」という言葉も、それにちょっと似ているのかも。
AIを使えば、非エンジニアも関われる範囲が広がる？
ここも、私が最近面白いと感じているところ。
以前だったら、プログラミングの経験がほとんどない人がWebアプリの画面を作るのは、かなり難しかったと思う。
でも今は、Claude CodeやCodexなどのAIに相談しながら、コードを書いたり修正したりすることもできる。
もちろん、AIがコードを書いてくれたからといって、何も確認しなくていいわけじゃない。
画面が意図どおりに動くか、ほかの部分を壊していないか、どこまで自分が変更していいのか。
そういうことを理解する必要はある。
それでも、以前より挑戦しやすくなっているのは確かだと感じている。
私自身も、まだ勉強中。
でも、勉強中だから何もできない、とは思わなくなってきた。
2か月前は、言葉すら知らなかった
振り返ってみると、ちょっと不思議。
8月の初ハッカソンでは、フロントエンドとバックエンドという言葉を初めて知った。
10月には、国際AIハッカソンのIdea Proposalで、自分がフロントエンドに関わる担当として書いてもらえた。
もちろん、2か月でエンジニアになったわけじゃない（笑）。
まだ分からないことはたくさんある。
でも、実際に参加して、知らない言葉を見て、分からないことを調べて、できることを少しずつ増やしてきた。
全部理解してから参加するんじゃなくて、参加するから少しずつ理解できる。
私には、これがAIハッカソンの面白さの一つなのかもしれない。
次に参加するハッカソンでは、また知らない言葉に出会うと思う。
でも、それも楽しみ！