TAKASHI ABE - PORTFOLIO

ひとつの行動おもいが、
未来を変える

TAKASHI ABE

はじめまして。エンジニア歴6年目の阿部です。
フロントエンド・バックエンド共に手掛け、主にWEBサイトの作成と運用に携わってきました。2025年現在は、外部APIを用いた社内用の管理ツールの作成を担当しています。
特にLaravel業務ではCRUD操作などインフラを担当し、自社開発SNSではreactを用いてSPAの作成とAPIの開発を業務として行いました。

また、新人教育にも携わっています。
教える楽しさと難しさ、培った経験を伝え、より良いモノが世の中に出ることを望みます。

学生時代はゲームが日常でしたが、社会人になってからは小説を書く趣味へとシフトしました。最近、初めて東京に踏み入れ、そこで将来のことを考える様々な経験を得たことで危機感を覚えたところ。
人生を見つめ直し、設計して、望む未来のために、今までとは違う行動を心がけていきたい。


作った物が世の中に出る喜び、クリエイティブな仕事に誇りと楽しさを。
未来を創るエンジニア、
技術で誰かの役に立つモノを創る、それがエンジニアの醍醐味。

フロントエンド

フロントエンドスキルのグラフ
  • HTML
  • CSS&SCSS
  • Javascript
  • React
  • Bootstrapなど

バックエンド

バックエンドスキルのグラフ
  • Laravel（PHP）
  • Python
  • Bootstrapなど

インフラ

インフラスキルのグラフ
  • MySQL
  • Git
  • AWS
  • Apache
  • GCP
  • その他

実績

【入社1年目／アクセシビリティを考慮したWEBサイトの作成】

  • ・概要
    障がいを持った方が訪れても不自由なく閲覧できるように音声読み上げ、ALTの設定、配色、文字サイズ等考慮したサイト。
  • ・担当（Laravel、javascript＆jQuery）
    主にフロントエンドのビュー作成。
  • ・取り組み
    個人・法人と分れたページ構成は、ビューだけでも共通クラスやスタイルを考える必要があった。redmineでタスク管理を行った。

【入社2年目／オンラインで繋がるWEBサイトの作成】

  • ・概要
    オンライン会議用ツールを使い外出しなくても気軽に著名人とWEB上で繋がれる自社サービスサイトの開発。
  • ・担当（Laravel、javascript＆jQuery）
    主にフロントエンドのビュー作成。
  • ・取り組み
    短期間で仕上げる必要性もあり、みんなが一致団結してスケジュール通りに進めた。様々な人がオンラインで顔合わせするので、不具合等いっそう気を付けるところがあった。

【入社3～4年目／音声AIを用いた声の保存プロジェクトの開発】

  • ・概要
    自分の声を残して大切な人に贈るなど、声をAI学習させてバンクとして残そうというプロジェクト。
  • ・担当（python、perl、shell、Laravel、mysql、adobe）
    音声AIの開発、及び、音声収集と編集。プロモーションムービーの作成。LPの作成。
  • ・取り組み
    様々な分野を担当したがよくできたなと思う。すべてが大変の一言に尽きるが、AIの時代を感じ、様々なオープンソースを試し、精度の良い音声合成AIが作れた。
    ※オープンソースを多少カスタムした程度です（AI開発は行っていません）

【入社4～5年目／自社SNSの開発】

  • ・概要
    ユーザーが投稿した目標や夢を、動画広告を視聴することで応援できる自社SNSサービスの開発。
  • ・担当（react、Laravel）
    Laravel開発をreactにシフト開発。速度や効率に問題があるAPIの改善。
  • ・取り組み
    SPAサイトの開発。reactによる開発は初めてで、laravelとは異なる状態管理やUI開発に戸惑った。上司に何度も説明をしてもらって理解を深め、同僚とコミュニケーションをとって開発を進めた。

【入社5年目～／広告運用のための社内管理ツールの開発】

  • ・概要
    日々チェックする広告の設定やデータをチェックしやすいように、各サービスのAPIを使い一つにまとめた管理ツールの開発。
  • ・担当（Laravel、javascript＆jQuery、AWS、GCP）
    DB設計、サーバー構築（AWS）、サーバー監視システム構築、消費メモリ改善案と対策、プロジェクト管理、外部APIの確立。
  • ・取り組み
    塵も積もれば山となる想像以上に膨大なデータ量が特徴。過去データも必要があり、DB構造と取得・保存は困難を極め、スペックを抑えつつ使えるように開発着手中。
    今まで開発してきた中で一番トライ＆エラーのあるプロジェクト。

この他にも、こんな経験をしています。

  • ・Wordpressを用いたWEBサイトの作成及び保守運用。
  • ・管理画面テンプレート＆bootstrapを用いたロールによって異なる管理画面の開発。
  • ・AWS Amplifyを使用した簡易SPAの作成。
  • ・javascriptによるサイト上のアニメーションについて担当、SVGアニメーションも作成。
  • ・新人教育～テスト試験の担当。
  • ・GCPのAPIを活用したマップやスプレッドシートの編集。
  • ポートフォリオ

ポートフォリオ

ポートフォリオのfigma外部リンク ポートフォリオのgithub外部リンク
2024.12.30
使用言語など
フロントエンド：HTML、CSS、Javascript（Jquery）
バックエンド：PHP
その他：figma、github、Xserver、お名前.com
作成時間
デザイン：22時間
コーディング：20時間
実装：4.5時間
デプロイ：3時間
その他：5時間
目的
副業を始めようと考えたのがきっかけ。自分を表すサイトがなかったので作成を決意。
伝わりにくい技術面や人柄が伝わればと思ってデザインから作成しています。
制作過程
1画面完結のシンプルで見やすいSPAサイトを目指しました。状態管理がなく、単一HTMLではあるもののページ切り替えは存在しないため、厳密にはSPAではありませんが、SPAもどきと表現するのが正確です。
デザインは専門外ですが、内容を重視して工夫しました（figmaには没案も掲載）。
コーディングについてはまだ勉強するところが多々ありますが、初心者の参考になるよう心掛けています。
お問い合わせフォームは素のPHPで実装しています。
そのほか今回気を付けた点についてはgithubのREADMEをご覧ください。
改善
やはり、納得のいくデザインにはなっていません。ここはなかなか難しいところなので、次回はデザイナーさんにお願いしたいところ。
コーディングについても考えるところが多くあるので、適切なコードで作成していきたいです。

最後まで閲覧いただきありがとうございます。
このポートフォリオは、私が初めてデザインからデプロイまでを一貫して手がけた作品です。
WEBサイトやスキル、私についてなどコメントがありましたら気軽に下記フォームよりお問い合わせください。