Vibe Coding Bootcampでは、
「その場で手を動かし、実際に動くプロダクトを作る」ことを大切にしています。
そのため、当日をスムーズに進めるために、
以下の4つの準備を事前に完了させておいてください。
💡 プログラミング未経験でも大丈夫です
このページでは「何を・どこで・どうやって」やるかを、できるだけ噛み砕いて説明します。
① サーバー / ドメインの購入と設定（Hostinger推奨）
なぜ必要？
- 作ったWebサービスを実際にインターネット上で動かすため
- 「自分のURL」を持つことで、完成イメージが一気にリアルになります
おすすめサービス
- Hostinger
理由：
- 初心者でも管理画面がわかりやすい
- 料金が安い
- FTP / SFTPが簡単に使える
- 海外・国内どちら向けでもOK
やること（ざっくり）
- Hostingerにアクセス
- 👉 https://www.hostinger.com/jp/pricing
- アカウント作成
- レンタルサーバーを契約
迷ったら「レンタルサーバーBusiness¥ 469/月+2 ヶ月無料」でOK（20%オフチケットはこちら）
- ドメインを取得
.com/.jpなど何でもOK- Hostingerの場合ドメインも1年無料になるキャンペーンも行っている
Hostingerでサイトを作成
ドメインがある場合はドメインを入力し、ドメインが無い場合は「Use temporary domain」を設定すると、仮ドメインのまま開発を開始できます。（後で設定できます）
② FTPツールをインストールし、サーバーに接続する
なぜ必要？
- 自分のPCから、サーバーにファイルをアップロードするため
おすすめFTPツール
- FileZilla（無料）
公式サイト
👉 https://filezilla-project.org/
インストール後にやること
HostingerでFTPアカウントを作成します。
Directoryを必ず「/」にしてください。
作成後、以下を確認します：
- ユーザー名
- パスワード
- ホスト名（サーバーアドレス）は以下の数字.数字.数字.数字を使います。
それをFileZillaに入力して「接続」。
mac / Windows 注意点
- 操作はほぼ同じ
- macの場合
- 初回起動時に「このアプリを開きますか？」と出たら許可
- Windowsの場合
- セキュリティソフトが警告を出すことがあるが、公式版ならOK
④ Cursor & Antigravity をインストール（＋SFTPプラグイン）
CursorAntigravityとは？
- AIと一緒にコードを書くエディタ
- プログラミング初心者の“最大の味方”
- 無料枠がなくなってしまう場合があるので、2つインストールします。
インストールするもの
1. Cursor
2. Antigravity
mac / Windows 注意点
- mac
- 初回起動時「開発元が未確認」→ システム設定から許可
- Windows
- ZIP展開後、Program Filesに入れなくてOK
- デスクトップ直下などがおすすめ
インストールできたら、Cursorを起動して、自分のパソコン（ローカル）で開発するフォルダを決めます。
（/Documents/mysite/）
Cursorでそのフォルダを開きます。
3. SFTPプラグイン（Cursor内）
- 拡張機能（Extensions）を開く
SFTPで検索- インストール
SFTPの設定を行う
Macの場合：Command + Shift + P
Windowsの場合：Ctrl + Shift + P
→ SFTP: Configをクリック
するとsftp.jsonが設定されるので、それを以下のように書き換える
以下をコピペして、hostとusernameとpasswordを編集して保存してください。
{
"name": "本番環境",
"host": "***********",
"protocol": "ftp",
"port": 21,
"username": "***********",
"password": "***********",
"remotePath": "/",
"localPath": "./",
"ignore": [
".vscode",
".DS_Store",
".sftp.json",
".gitkeep",
"node_modules",
".git"
],
"uploadOnSave": true,
"useTempFile": false,
"openSsh": false,
"downloadOnOpen": false,
"syncMode": "update",
"watcher": {
"files": "**/*",
"autoUpload": true,
"autoDelete": false
}
}
チェックリスト（前日までに）
- Hostingerでサーバー＆ドメイン取得済み
- FTPツールでサーバーに接続できる
- GitHub設定→こちらのブログ記事を参照
- Cursor / Antigravity 起動確認
- SFTP接続テスト完了
もし途中で詰まったら
Bootcamp当日にもサポートしますが、
どこまでできたかを把握しておくとスムーズです。
- スクショを撮っておく
- エラーメッセージは消さずに残す
Vibe Coding Bootcampのコミュニティ「#開発相談」で質問を投げていただけると、回答しやすいです。
最後に
Vibe Coding Bootcampは
「知識を学ぶ場」ではなく「作れるようになる場」です。
事前準備を済ませておくことで、
当日は ひたすら作ることに集中できます。
それでは、Bootcampで会いましょう 🚀
一緒に「最初の一歩」を踏み出しましょう。
