👌

Replitを使って手軽に開発環境を構築

2024/10/07に公開

はじめに

Replitは、ブラウザで数クリックするだけで開発環境が出来上がります。
初心者にとって難易度が高い環境構築を一旦置いておいてアプリケーション開発に集中できます。

そんなReplitを使ってLaravelを起動するまでを解説したいと思います。

Replitって何?

Replitはクラウド上で動作するオンライン開発環境です。
Python、JavaScript、Java、C++など、多くのプログラミング言語をサポートしていて、何もインストールせずにすぐに使い始められます。

https://replit.com/

Replitの便利なポイント

  • どこでも使える開発環境

    • クラウド上の開発環境なので、使っているPCのOSに依存せずに開発可能
    • ハードウェアに依存しないので、すぐにアクセスして作業開始
  • チームでのリアルタイムな共同作業

    • Google Docsのように、複数人で同時にコードを編集可能
    • リモートでのペアプログラミングやチームでの開発に最適
  • 設定不要の実行環境

    • プログラミングを実行するための環境が事前に備わっているのですぐにプログラム実行が可能
    • サーバーの設定不要で、初心者でも簡単に学習が進められます
  • AIアシスタントでさらに快適に

    • コードの補完やエラーの提案をしてくれるAIアシスタント内蔵
    • 初心者でもAIを活用しながら学べ、実装効率もアップ

Replitを始めるには

  1. 公式サイトにアクセスし、無料アカウントを作成
  2. 新しいプロジェクト("Repl"と呼ばれる)を作成
  3. ワークスペースで開発をスタート

1. 無料アカウントを作成


公式トップ


Sign up for free


サインアップ後


名前と目的、経験について
目的は個人利用とし、経験は初心者としました。
もしかしたら経験の選択がAIの回答に影響あるかもしれません。


料金プラン選択
Freeの下にある、「Continue with Starter」をクリック

2. 新しいプロジェクトを作成


画面中央上部の青いボタン「Create Repl」


プログラミング言語の選択
「Template」に作成したいプログラミング言語を入力すると絞り込みができます。
ここではLaravelを選択します。


テンプレートの選択とプロジェクト名の指定
プロジェクトの名前が必要なので入力します。
「laravel-sample」としました。
入力を終えたら、「Create Repl」でプロジェクトを作成します。

3. ワークスペースで開発をスタート


ワークスペースの表示
最初にワークスペースを開くとチュートリアルとして表示されている内容の説明が始まります。

エディタ領域
ここで各ファイルのコードを記述していきます。

実行ボタン
画面中央上部にあります。
プログラムの実行ができます。
ウェブアプリケーションであれば、ボタン1つでウェブアプリケーションが起動します。

出力領域
プログラムの実行結果が表示されます。
ウェブアプリケーションの場合はウェブページが表示されます。

サイドバー
ツールはパッケージ、デバッガー、チャット、Gitなどがあります。
どのファイルやツールもドラッグ&ドロップで開くことができます。
すべてのツールはサイドバーで開くのではなく、タブとして開きます。

招待
メンバーを招待して一緒にコーディングしたりレビューしたりできます。

4. 実行確認

Runボタンで実行してみます。
数秒でアプリケーションが起動し、右の出力領域に表示されます。

表示枠が小さいので、全画面にして確認したい場合は、出力領域の右上にあるアイコンをクリックすると別タブで開いてくれます。

アプリケーションの起動を止めたい場合は、「Run」ボタンの代わりに表示された「Stop」ボタンをクリックするか、右下のターミナルでCtrl+Cで止められます。

無料プランと有料プランの違い

Replitには無料プランと有料プラン(Hackerプラン、Proプラン)があります。それぞれのプランでできることを整理しました。

無料プランでできることと制限

  • プロジェクトの作成と保存
    • プロジェクトの作成は3つまで。
    • ストレージ制限: アカウントあたり2GBまで。
    • AIはBasicなもので無制限利用可能
  • リアルタイムコラボレーション
    • 他のユーザーとリアルタイムでコードを共有して編集できますが、招待できるのは1人まで
  • プログラムの実行
    • 開発時間の制限: 最大1200分。
    • CPUとメモリの制限: CPU使用率とメモリ使用量に制限があり、大規模なプロジェクトには対応が難しい。

有料プランでできること(Coreプラン)

無料プランに加えて以下の事が可能に

  • Coreプラン
    • プロジェクトの作成は無制限。
    • より多くの実行リソース: プログラムの実行に必要なリソースが増加し、より大規模なプロジェクトに対応可能。
    • プライベートRepl: 公開せずにプライベートでプロジェクトを保存できます。
    • 開発時間の制限: 無制限。
    • AIモデルとしてGPT4oやCloude Sonet 3.5の使用が可能
    • ストレージの増加: プロジェクトあたり最大50GBのストレージが利用可能。
    • SSH接続可能

詳細な料金プランについては、料金プランページをご確認ください。

Replitを使ってみて感じたこと

  • 設定いらずで学びやすい

    • 設定に手間取ることなく、すぐにコーディングに集中できる
    • 初心者には特にピッタリな開発環境
  • 共有が簡単

    • リンク一つでプロジェクトを共有できるので、仲間とのコラボが楽
    • メンターや友人とリアルタイムで一緒に進められる
  • クラウドでどこでも作業

    • 移動中はスマホやタブレットで続けることも可能。専用のアプリ版があります。
    • 操作している端末の性能には影響受けないので、PCの性能が低かったり、普段使っていない出先のPCなどでも編集可能

まとめ

Replitは手軽に使えて多機能なオンライン開発環境です。
インストール不要でサクッと使えるReplitで、開発体験が楽しいものになるかもしれません。
まだ使ったことがないなら、ぜひ公式サイトを訪れてみてください。

参考情報

Replit公式サイト
料金プランページ

K2Oシステムテックブログ

Discussion