こんにちは！最近、旅行に関するWebサービスTraveler's class
をリリースしました。実は、私はWeb開発の初心者で、HTMLやCSS、JavaScriptの基本的な知識しか持っていません。しかし、ChatGPTと対話しながら開発を進めることで、数日間でサービスを完成させることができました。この記事では、その経験を共有したいと思います。
なぜWebサービスを作ろうと思ったのか
1〜2年前から、「何か自分でWebサービスを作ってみたい」という思いがありました。そこで、会社の同期数人と一緒に、勉強の一環としてWeb開発に取り組むことにしました。
最初の一歩：独学での挑戦
まずはAWSのEC2にApacheのWebサーバーを立て、HTML、CSS、JavaScriptを学びながら簡単なページを作成してみました。しかし、専門的な知識がない中での独学は思った以上に大変で、勉強に割けるリソースも限られていました。
ChatGPTとの出会い
そんな中、ChatGPTがリリースされ、コード生成もできることを知りました。これは大きなチャンスだと思い、早速利用してみることにしました。
ReactとNode.jsへの挑戦
ChatGPTに相談しながら、ReactとNode.jsを使って開発を進めることにしました。これらの技術は全くの未経験でしたが、ChatGPTがコード例や具体的な手順を提供してくれるので、スムーズに理解することができました。
Reactの導入：フロントエンド開発にはReactが適していると教えてもらい、基本的なコンポーネントの作り方から学びました。
Node.jsの活用：サーバーサイドにはNode.jsを使用し、APIの構築やデータのやり取りを実装しました。
開発環境の構築
初心者でもわかりやすいシンプルな環境を目指して、以下の構成で開発を進めました。
AWS EC2にReactとNode.jsを実装：ChatGPTの指示に従い、EC2インスタンスに必要な環境を整えました。
ドメインの取得とCloudFrontの設定：独自ドメインを取得し、CloudFrontを経由してEC2に配信されるように設定しました。
※正直なところ、AWSの設定やネットワーク周りはまだ完全には理解できていませんが、ChatGPTのサポートでなんとか形にすることができました。
MongoDB Atlasでデータ管理
データベースの選定に関してもChatGPTに相談し、MongoDB Atlasを使うことにしました。クラウド上で簡単にセットアップでき、スケーラビリティや可用性も高いという利点があります。
チャットデータの保存：ユーザー間のチャットメッセージやトピック情報など、動的なデータをMongoDB Atlasに保存しました。
Node.jsとの連携：サーバーサイドのNode.jsアプリケーションとMongoDB Atlasを接続し、データの読み書きを実装しました。
リアルタイム通信：Socket.IOを使用して、リアルタイムでのチャット機能を実現しました。
開発したサービス「Travel Class」の紹介
コンセプト
海外からの旅行者が、日本に関するさまざまなトピックについて、不特定多数の人とリアルタイムで自由に情報を共有できるプラットフォームです。
特徴
登録不要で簡単アクセス：誰でも手軽にアクセスでき、リアルタイムでやり取りが可能です。
今後の展望
AWSの無料枠を使用してサービスを公開しましたが、友人から「大きな負荷には耐えられないので、LambdaとS3を使った方が良い」とアドバイスを受けました。今後は以下の点を改善していく予定です。
サーバーレスアーキテクチャへの移行：LambdaとS3を活用して、スケーラビリティの高いサービスにする。
まとめ
ChatGPTを活用することで、Web開発初心者の私でも短期間でサービスをリリースすることができました。わからないことがあっても、その都度質問して解決できるので、非常に効率的でした。
これからも新しい技術に挑戦しながら、「Travel Class」をより良いサービスに育てていきたいと思います。もし同じようにWeb開発に興味がある方がいれば、ぜひChatGPTを活用してみてください！
ご覧いただき、ありがとうございました！
よければいろいろなFBをいただけると嬉しいです。
PS
最後にこの文章もGPTに書いてもらいました。そのおかげで初めてQiitaに投稿するまでに使った時間は出勤前の10分です。これからもGPTと仲良くたくさんアウトプットしたいと思います