Mayuka Umezawa

茜 渡邉

課題
ー 以下のような課題点があり、個人開発に取り組んだ。
応用情報技術者資格を取得したが、設計、開発の実践経験が不足していると感じた。
業務で使用したReact.js、Material-UI、Dockerの経験を活かして、カフェの口コミ投稿アプリを作成した。

設計、開発、テストを行った。
実装した機能は以下の通り。

・ログイン、ログアウト機能
・新規会員登録機能
・ユーザー情報変更機能
・退会機能
・店舗検索機能
・店舗情報投稿機能
・お気に入り登録、削除機能
・コメント投稿、、削除機能
・お気に入り、コメントを投稿した店舗の確認機能
実装予定機能は以下の通り。

取り組み
個人開発では主に以下の作業に取り組んだ。

①設計
カフェの口コミ投稿アプリを設計した。
【取り組み】
実装する機能を紙に書きだして選定した。
draw.ioを用いてDBを設計した。
figmaを用いてアプリのデザインを行った。
Stoplight StudioでAPIを設計した。

②開発
カフェの口コミ投稿アプリの機能を実装した。
【取り組み】
Dockerを用いてフロントエンドサーバー、APIサーバー、MySQLサーバーを構築した。
Docker-composeでサーバー管理を容易にした。
フロントエンド開発ではTypeScript、Next.js、Material-UIを用いて画面開発を行った。
ユーザーのログイン状況によって表示する画面のレイアウトを変更している。
バックエンド開発では、Golang、Gin、gormを用いてAPIサーバーを実装した。Golangでjwt認証を実装した。

③テスト
カフェの口コミ投稿アプリのテストを実施した。
【取り組み】
GolangでAPIのテストを実装した。go-testfixturesライブラリを使用してテストデータの管理を行った。

工夫した点
フロントエンド
使用頻度が高いものは共通関数として定義する、
共通するレイアウトはコンポーネントとして抜き出す、再利用可能にするためにAPIへのリクエストメソッド、レスポンスデータの処理を抜き出す等、コードの共通化を意識しました。
ユーザビリティを意識して、stateを用いてデータを管理、useSWRでデータ取得、表示の高速化を意識しました。
ローディング中、処理時に画面にメッセージやダイアログを表示してユーザーのストレスを少なくすることを意識しました。
マテリアルuiを用いることで、デザインを統一、cssデザインの手間を削減し、レスポンシブデザインに対応しました。

バックエンド
jwtトークンの認証機能をミドルウェアで実装することでセキュリティ機能を実装、メソッドを共通化することで保守性を高めました。
GolangのフレームワークにGin、DBへの接続にはORMライブラリであるgormを用いてコード量を削減、可読性の高いコードを意識しました。
testではgo-testfixturesを用いて、テストデータの管理を容易にしました。
Logを書くことで、エラーが発生したさい、原因の特定が容易になるように工夫しました。

全体
APIリクエストのurlとNext.jsでのページパスを統一することで、ブラウザからurlを直接入力した場合でも、エラーが発生しないようにしました。

個人開発　カフェ口コミアプリ

Qiitaで情報発信

株式会社マンガボックス / エンジニア

Junichi Izumi

株式会社出前館, デザイン推進部 部長

Youhei Ookawara

Taihei Onishi

株式会社スタメン, 代表取締役社長 / CEO

Mami Koshizuka

突合システム開発プロジェクト

一般社団法人向け会員管理システム 追加機能開発

一般法人向け執務管理システム 追加機能開発

基幹システム保守業務

低糖質スポンジケーキ　薄力小麦粉代替物の最適配合

岩手大学管弦楽団

Accomplishments / Portfolio

応用情報技術者試験

基本情報技術者試験

簿記3級

Awards and Certifications

Publications

golang 

TypeScript

Next.js

Docker

MySQL

GitHub

draw.io

figma

React.js

JavaScript

オタク気質

茜渡邉

茜渡邉

茜 渡邉

茜 渡邉

茜渡邉

茜渡邉