ポートフォリオ（成果物）

正式運用版イナコー掲示板
イナコーWeb掲示板React版を更に改良して一般運用できるまでに成長

書き込み自由なサンプルURL：https://inako-system.com/Users/sample

管理者のメッセージ修正／削除機能。パスワード及びアクセスユーザID暗号化。アクセストークン制御。CORS対応。実際のユーザ登録。メール認証機能。スレッド機能。レス機能。タイトル検索。ページ制でなく、無限スクロールでページ送りする。完全レスポンシブ。新規書き込みを管理者にメール通知

C# ASP.NET WebAPI(.NET 8)
RestfulAPI(GET/POST/PUT/PATCH/DELETE)
React.js(Vite使用Redux)
TypeScript
Tailwind CSS
HTML/CSS
EntityFrameworkCore
PostgreSQL
Heroku / firebase

海外旅行向けWebアプリ（※Udemy動画教材のリファクタリング）

備わってる機能
スライダー。スクロール監視でアクション

記事：https://lightning-shine.com/post3966/
のUdemy教材(JavaScript)で作ったWeb画面をReact仕様にリファクタリングしたもの

React.js
スライダー
スクロール監視
アニメーション

DiscordクローンWebアプリ（※Udemy動画教材）

https://discord-clone-e62d4.firebaseapp.com/

備わってる機能
チャンネルの新規作成。チャンネル内メッセージ送信。Googleアカウントログイン、ログアウト機能。リアルタイム更新

React.js
material-UI
React-Redux
TypeScript
Sass型CSS
firebase(Hosting/FireStore/Authentication)

 ツイッタークローンWebアプリ（※Udemy動画教材）

https://twitter-clone-udemy-1b70e.web.app/

備わってる機能
真ん中のツイート機能。画像URL貼り付け。右に本物のツイッターウィジェット。リアルタイム更新

React.js
material-UI
firebase(Hosting/FireStore)

↑サムネクリックで動作を見ることができます

備わってる機能
親タスクの追加と削除。小タスクの追加と削除。タスク毎のドラッグ＆ドロップによる入れ替え

React.js
ドラッグ＆ドロップ専用ライブラリ

イナコーWeb掲示板React版（レスポンシブ）

※HerokuのDBが有料になってしまったため、サンプル公開場所は別途考えます

備わっている機能

管理者のメッセージ修正／削除機能
運用バージョンはもっとセキュリティ、使い勝手の向上を目指す予定

C# ASP.NET WebAPI(.NET 8)
RestfulAPI(GET/POST/PUT/DELETE)
React.js(Vite使用。UseEffect/UseState/Fetch API)
Tailwind CSS
HTML/CSS
EntityFrameworkCore
SQL Server

イナコーWeb掲示板（レスポンシブ）

※HerokuのDBが有料になってしまったため、サンプル公開場所は別途考えます

備わっている機能

XSS／CSRF 対策
名前のCookie保存
管理者のメッセージ修正／削除機能
(ユーザ：guest ／ パス1234でログイン可能)

C# ASP.NET MVC（.NET 6）
PostgreSQL
HTML／CSS
EntityFrameworkCore
BootStrap
MDBootStrap
Razor
Heroku

ポケモン図鑑アプリ（※Udemy動画教材）

解説：PokeAPIのGETメソッドを使ってJSONデータ取得したものを表示するだけの簡易Webアプリケーション

備わっている機能

・前へ／次へ　のページング機能

記事：https://lightning-shine.com/post6427/

React.js
Visual Stdio Code
HTML／CSS

ブログアプリ（※Udemy動画教材）

解説：ブログというよりは簡易掲示板のようなもの。メッセージの更新はできないがアカウント毎で削除は可能。また、ログインしないと記事は投稿できない。

備わっている機能

・ローカルストレージを使ったログイン中保持機能
・アカウント毎のメッセージ削除機能

記事：https://lightning-shine.com/post6427/

React.js
Visual Stdio Code
HTML／CSS
firebase Console(Googleアカウントでログイン可能)

ノートアプリ（※Udemy動画教材）

解説：ノートの追加／保存／編集／削除を行える。

備わっている機能

・ローカルストレージを使ったノート保存機能
・マークダウン言語を使用可能

記事：https://lightning-shine.com/post6427/

React.js
Vite
Visual Stdio Code
HTML／CSS

記事へのリンクを掲載
・スポンサーバナー表示
・サポート中