Keep
Learning,
Keep
Growing.
ようこそ、CiderTechLabへ!
このサイトでは私の
プロフィール、スキルセット、ポートフォリオ、キャリア
の紹介をしています。どうぞごゆっくりご覧ください。
About Me
S.K
- 経歴
- 大学の理工系学科卒業後、システムエンジニアとして6年間従事しました。詳細はCareerをご覧ください。
- 実務経験
- 主に業務系システムを担当、運用及び一部開発を経験。特にデータベース周りの知識を深めることができました。
- 現在の目標
- フロントエンドエンジニアを目指し、HTML/CSS/JavaScript/TypeScriptを中心に学習し、Tailwind CSSやReactも学習中です。また、SE経験を活かし、バックエンド領域(特にデータベース)の理解も深めたいと考えています。
- 関心分野
- 構造化と体系的な設計に関心があります。BEM記法、Tailwindのユーティリティクラス設計、Reactのコンポーネント設計といった、体系的な設計アプローチに魅力を感じています。
- 趣味
-
登山です。ピークハンターで主に丹沢山系、高尾山系の大半は登頂しています。富士山登頂は5回成功しています。(吉田口、富士宮口ルート)
また、最近は生成AIにも興味があり、プロンプトエンジニアリングやローカルLLM(gemma系)の実験など、楽しみながら技術を深めています。
Skills
Markup & Styling Languages
-
HTML
- #セマンティック要素
- #フォーム要素・バリデーション
- #アクセシビリティ(スクリーンリーダー対応)
- #メタ情報
-
CSS
- #BEM記法
- #flex/gridレイアウト
- #レスポンシブデザイン
- #アクセシビリティ(カラーデザイン)
-
Markdown
- #見出し、リスト、表
- #README記述
- #Mermaid
- #GitHub Wiki
Programming Languages
-
JavaScript
- #制御構文
- #関数、アロー関数
- #DOM操作
- #非同期処理
-
TypeScript(学習中)
- #型安全性、静的型チェック
Query Languages
-
SQL(Oracle/PostgreSQL)
- #CRUD操作
- #JOIN句
- #サブクエリ
Frameworks
-
React(学習中)
- #基礎学習(公式ドキュメント)
- #コンポーネント設計(予定)
-
Tailwind CSS
- #生成AI×ペアプログラミング
- #生成AI×プロトタイプ制作
- #ユーティリティクラス設計
Others
-
Environment
- Windows11、Android 16
- PC上での確認はWindows11で、スマートフォン上での確認はAndroid 16で行いました。
- Node.js
- JavaScriptのパッケージ管理ツールであるnpmも同時に使える点で採用しました。
-
Tools
- Visual Studio Code
- 拡張機能導入で開発環境を整えやすく、GitHub連携、生成AIとのペアプログラミングもし易いという点で採用しました。
- Git、GitHub
- コードのバージョン管理、変更履歴の管理、バックアップのために導入しました。
- GitHub Copilot
- コード補完やレビュー等、ペアプログラミングに近い形で使用しました。
- GitHub Projects
- バグ管理、タスク管理に使用しました。
- GitHub Wiki
- ドキュメントの整備、管理に使用しました。
- ChatGPT
- アイデア出し等、思考の壁打ちとして利用しました。
- Figma
- UI/UX設計に使用しました。
-
Quality
- Prettier、stylelint、ESLint
- コードの可読性向上、品質向上のために導入しました。
- Google Chrome、Mozilla Firefox
- Google ChromeはBlink、Mozilla FirefoxはGeckoエンジンを採用しているため、両方での動作確認を行うことでなるべく多くの環境での動作を保証できると考え採用しました。
Learn
-
WebSites
- ウェブ開発の学習 | MDN
- HTML、CSS、JavaScriptの基礎を学ぶために活用しました。各技術の基礎から応用まで幅広く解説されており、非常に参考になりました。
- TypeScript入門『サバイバルTypeScript』〜実務で使うなら最低限ここだけはおさえておきたいこと〜
- TypeScriptの基礎を学ぶために活用しました。実務で役立つポイントが分かりやすく解説されており、TypeScriptの理解を深めることができました。
-
Books
- エビスコム『モダンHTML&CSS 現場の新標準ガイド』マイナビ出版
- HTMLとCSSの基礎固めのために読みました。HTMLとCSSの歴史から、セマンティックマークアップの重要性、アクセシビリティ対応、ブラウザのレンダリングの流れまで解説されており、非常に参考になりました。
- CodeMafia 外村 将大『独習JavaScript新版』翔泳社
- JavaScriptの基礎固めのために活用しました。基本的な文法から、非同期処理やモジュールの使い方まで幅広く解説されており、非常に参考になりました。
- Josh Goldberg『初めてのTypeScriptーー型安全なJavaScriptでWeb開発を加速する』オライリー・ジャパン
- TypeScriptの基礎固めのために活用しました。型安全なJavaScriptの利点や、TypeScriptを使ったWeb開発の方法について詳しく解説されており、非常に参考になりました。
Portfolio
-
各作品の仕様書については
GitHub Wiki
をご覧ください -
HTML & CSS
学習まとめノートHTMLとCSSの学習で気が付いた点や注意点をまとめたサイトです。
-
JS & TS
学習まとめノートJavaScriptとTypeScript学習の歩みと、気が付いた点や注意点をまとめたサイトです。
-
お問い合わせフォームモックアップ(Contact)
Form関連タグ、バリデーション設計の練習として制作しました。入力チェックに手を焼きました。
Career
-
1年目~2年目
商品・サービス管理システム運用PJ -
金額や有効期限の設定、新商品・新サービスの追加設定を担当しました。
企画担当や連携システム担当との調整が多く、コミュニケーション力や調整力を鍛えることができました。 また、設定値の変更に伴う影響範囲の調査を通じて、システム全体の理解を深めることができました。 ドキュメント化の重要性も学びました。 -
3年目~4年目
通信システムデータベース移行PJ -
主にデータベース(Oracle)のデータ移行ツールの開発、実際の移行作業を担当しました。
RDBMSの基本的な動作原理、テーブル設計の思想やSQL、PL/SQLの知識を深めることができました。 またテスト工程にも携わり、テストケースの設計からソフトウェア品質の重要性を学びました。
実業務に役立てたいと思い、Oracle Bronze DBA 2019の資格を取得しました。 -
5年目~6年目
顧客情報管理システム運用PJ -
BIツールを使ったデータ抽出業務を担当しました。
大量のデータの取り扱い方法や、データの精査方法を学びました。SQLではなく、BIツールの操作によりデータ抽出を行うため、ツールの特性を理解することの重要性を学びました。