Mama Calendar は、Node.js + MongoDB および PHP + MariaDB という 2 つのバックエンド実装を備えた React Native (Expo) で書かれたクロスプラットフォームのイベントおよびリマインダー アプリケーションです。
このアプリケーションでは、絵文字を分類してイベントを作成し、繰り返しの種類 (1 回、毎年、毎月、毎週、毎日) を選択し、別の「重要なイベント」タブで今後 3 日間の重要なイベントを表示することができます。
テクノロジースタック
フロントエンドは、TypeScript、ナビゲーション用の Expo Router、アニメーション用の react-native-reanimated を使用した Expo SDK 57 を介して React Native 0.86 で作成されています。アイコンにはエキスポシンボルが使用されます（iOSではSFシンボル、Android/Webではマテリアルアイコン）。
バックエンドは 2 つのバージョンで実装されています。
- Node.js: Express 4、ネイティブ ドライバー経由の MongoDB 8、scrypt + Salt によるカスタム認証、手動トークン管理。 Docker Compose はクライアント (nginx)、サーバー、MongoDB を起動します。
- PHP: フレームワークなしの PHP 8.2、PDO + MariaDB 11、パスワード ハッシュ用の bcrypt、独自のルーター、および Composer 経由の PSR-4 自動読み込み。
アプリケーション関数
- 登録と認可: ユーザー名/パスワードとベアラー トークンを使用したシンプルなシステム
- CRUD イベント: 日付、絵文字、繰り返しタイプを使用してイベントを作成、表示、編集、削除します
- スマート フィルタリング: [重要なイベント] タブには、繰り返しルールを考慮して、今後 3 日間のイベントが表示されます。たとえば、年次イベントには、最も近い年次イベントが、毎月 – 月の日ごと、毎週 – 曜日ごとに表示されます。
- 絵文字ピッカー: イベントを素早く分類するための 20 個のプリセット絵文字
- 今日のイベントのハイライト: 今日のイベントは赤い背景 (#B71C1C) でハイライトされます
- ダーク テーマ: ライト テーマとダーク テーマの個別のパレットによるシステム カラー スキームの自動検出
- 国際化: React Context を介したロシア語と英語
- Анимации: анимированный сплэш-скрин с Keyframe API и упругой интерполяцией, анимированная иконка приложения с вращающимся свечением
- 管理エンドポイント: ユーザー、トークンの管理、マスター トークンによるデータベースのクリア
なぜ 2 つのバックエンド実装があるのですか?
Node.js バージョンがメインですが、よりクラシックなホスティングの代替として PHP バージョンが存在します。 API は完全に同一であるため、クライアント コードを変更せずに API を切り替えることができます。
インフラストラクチャ
スタック全体は Docker Compose を通じて生成されます。クライアントはマルチステージ ビルド (Expo エクスポート → nginx alpine)、Node.js 上のサーバー、MongoDB 8 を通じて組み立てられます。PHP バージョンの場合は、MariaDB 11 とテスト用の phpunit を含む別の compose ファイルがあります。
Web バージョンのアセンブリは、expo エクスポート の前に API_URL にパッチを適用し、後で元のファイルを復元する PowerShell スクリプトによって自動化されます。
出力
Mama Calendar は、React Native のモバイルおよび Web フロントエンドから 2 つのサーバー側オプションまで、全サイクルをカバーするフル機能のクロスプラットフォーム アプリケーションです。このプロジェクトは、そのアーキテクチャ、最新の Expo SDK 機能の使用、およびデュアル バックエンド実装において興味深いものです。
リンク
https://github.com/zefir1990/Mama-Calendar
https://demensdeum.com/software/mama-calendar/events
Leave a Reply