esports fullstack app

eスポーツフルスタックアプリ

• について
• ウェブクライアント
• Webサーバー/API
• モバイルクライアント
• インストール
• 追加メモ

について

このアプリケーションを使用すると、ユーザーは自分の空き状況を公開したり、同じゲームをプレイしている他のユーザーを見つけて接続したりできるため、一緒にプレイすることができます。

このプロジェクトでは、クライアント/サーバー アーキテクチャの基本を探ることが前提でした。バックエンドは、受信リクエストに基づいてリソースを提供および作成するためのシンプルな REST API を公開します。クライアント側では、Web アプリとモバイル アプリがサーバーとの通信を担当し、ユーザー操作を処理するためのインターフェイスを提供します。

ウェブクライアント

ReactJS で構築された Web クライアント。主な機能には、ゲームのリスト作成と広告の作成が含まれます。

ツール

• TypeScript
• ReactJS
• TailwindCSS
• 基数UI
• アクシオス

Webサーバー/API

リソースのリストと作成のためのルートを備えた REST API。

ツール

• NodeJS
• ExpressJS
• プリズマORM
• SQLite
• TypeScript

モバイルクライアント

クロスプラットフォームのモバイル クライアントは React Native で構築されています。主な機能には、広告の閲覧やプレーヤーの検索などがあります。

ツール

• TypeScript
• ネイティブに反応する
• 博覧会

インストール

• アプリケーションのルート ディレクトリ (モバイル、サーバー、または Web) に移動します。
• npm install実行して依存関係をインストールする
• npm run devでアプリケーションを実行する

留意すべき 2 つの点:

• クライアント アプリを実行する前に、サーバーをインストールして実行できます。
• 今日の時点では、このプロジェクトのアプリケーションはどれもデプロイの準備ができていません。

追加メモ

• このプロジェクトは純粋に実践的な演習であり、上記のツール/テクニック/コンセプトにおける私のスキルを開発および/または披露することを目的としています。これは、完全な運用対応ソリューションを意図したものではありません。ご質問がある場合、またはそれについてチャットしたい場合はお気軽にお問い合わせください。
• この演習は、Rocketseat の Ignite ReactJS プログラムからの教訓に従って構築されました。それは私によって適応/再設計された場合もあれば、そうでない場合もあります。