Ustack

About

PROFILE

  • 名前うえむー
  • 職業フロントエンドエンジニア
  • 出身・在住埼玉生まれ
  • 趣味麻雀・ボードゲーム・ゴルフ・学習
  • リンクX(旧Twitter) / GitHub / Nu-Blog

こんにちは、うえむーです。
都内でフロントエンドエンジニアとして仕事をしています。
休日はもくもく会・LT大会に積極的に参加して他のエンジニアさんと交流を積極的に深めたりしてます。
エンジニアとしていろんな言語・ビジネススキルを身につけ日々精進しており、最終的にはフルスタックエンジニアになりたいと思います。
また、自分はフォローをするのが好きで仲間が困ったことがあったら助けたい・力になりたいと思っています。
悩み事などがあったらいつでもご相談ください。
一生懸命夢に向かって頑張ってる人に積極的にサポートします。

うえむー

2021年に公開した個人のポートフォリオサイト「Ustack(ユースタック)」
Ustack(ユースタック)は 自分のイニシャルとフルスタックエンジニアを組み合わせた造語です。
フロントエンド・サーバーサイド・インフラなど様々なスキルを身につけ、フルスタックエンジニアになることを目指し日々努力しています。

SKILL

  • HTML

    HTML

    htmlは「HyperText Markup Language」の略であり、マークアップ言語の一つであり、僕が初めて学んだ言語です。
    HTMLは比較的自由にかける言語であり、初学者さんでもすぐに覚えられるマークアップ言語ですが、基礎やルールをしっかり覚える必要があります。
    それに反すると保守性が悪くなったり、レイアウトが任意通りに反映されなくなることがあります。
    また、W3Cと言ってWeb標準規格を準すること推奨されており、それを準しないと同じWebページでもブラウザによってレイアウトなどが変わってしまうという問題を抱えています。
    なので、基礎やルールをしっかり把握し、W3Cを準するようにマークアップして行きましょう。

    成果物・美容系のECサイト 1案件
    ・コーポレートサイト 3案件
    ・ブログサイト 1件(製作中)
    ・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)
    Nu-Blog
    Nu-stack

  • CSS

    CSS

    cssは「Cascading Style Sheets」の略であり、Webページをどのように装飾するかを調整する為の言語であり、僕が初めて学んだ言語の一つであります。
    cssを学んでいく上で難しいのはCSS設計・レスポンシブ対応です。
    最初の頃は不慣れで時間が滞ることもありますが、トライアンドエラーを繰り替えすことで結構上達しますので、諦めずに頑張りましょう。

    成果物・美容系のECサイト 1案件
    ・コーポレートサイト 3案件
    ・ブログサイト 1件(製作中)
    ・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)
    CODEPEN

  • Javascript

    Javascript

    JavascriptはWebページをコンテンツをアニメーション・拡大表示・アコーディオンさせたり、フォームに文字列を入力し送信できたりできます。
    Javascriptは様々なバリエーションがあり、jQuery・Vue.jsなどのフレームワークやGulpなどのツールキット、3Dアニメーションを実現できるthree.jsなど、開発者が学びたい言語トップ10に入る程ものすごい人気のある言語です。

    成果物・美容系のECサイト 1案件
    ・コーポレートサイト 3案件
    ・ブログサイト 1件(製作中)
    ・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)
    ・サードパーティツール導入
    ・Google Analyticsタグ実装
    ・MAツール導入
    Nu-Blog
    Web GL

  • PHP

    PHP

    phpは「Hypertext Preprocessor」を略したサーバーサイド言語であり、私が3番目に学んだ言語でありhtml/cssとは全く異なった記述なので結構苦労した覚えはあります。
    phpの特徴はhtml/cssも同時にコーディングすることも可能です。php「symfony・lavabel」は様々なフレームワークがあり、wordpressという世界的に利用されているCMSもphpから作成されております。

    成果物・ブログサイト 1件(製作中)
    ・コーポレートサイト 3案件
    ・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)
    ・API作成
    ・機能開発(お気に入り(個人で実装)・オフ率(チームで実装)・PayPay導入(チームで実装)・カート短縮実装(チームで実装))・バリデート実装など
    ・大手受託案件 モック作成

  • Symfony

    Symfony

    SymfonyはPHPに活用されているオープンソースWebアプリケーションフレームワークです。開発効率が高く、セキュリティの設定も最小限に済むなどが挙げられ世界的にも注目を集めています。弊社はSymfonyのフレームワークを利用してECサイトの作成を行なっています。

    成果物・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)
    ・API作成
    ・機能開発(お気に入り(個人で実装)・オフ率(チームで実装)・PayPay導入(チームで実装)・カート短縮実装(チームで実装))・バリデート実装など

  • Laravel

    Laravel

    LaravelはPHPのフレームワークの一つであり、Symfonyを基盤として作られております。PHPのフレームワークの中では一番人気があり、世界的に普及しています。

    成果物・アパレルECサイト 1案件
    ・ECパッケージ開発(50人以上のチーム)

  • Firebase

    Firebase

    Firebaseは、2011年にFirebase, Inc.が開発したモバイル・Webアプリケーション開発プラットフォームです。そのあと、2014年Googleに買収されてます。2020年3月現在、Firebaseプラットフォームには19の製品があり、9GAGを含む150万以上のアプリが利用されています。

    成果物・予約システム(開発中)

  • MySQL

    MySQL

    MySQLはオープンソースのリレーショナルデータベース管理システムであり、世界で最も人気があります。主に、開発環境構築・データ更新数時に利用します。

    成果物・開発環境構築
    ・DB同期
    ・アカウントデータ更新

  • jQuery

    jQuery

    jQueryはJavascriptコードをより簡潔に記述ができるようにするために設計されたJavascriptライブラリーです。
    jQueryにはハンバーガーメニュー・アコーディオンなどのアニメーションを簡単に実装できる便利なメソッドが用意されています。
    アニメーションを実装するにはjQueryを適用することを推奨します、

    成果物・美容系のECサイト 1案件
    ・ブログサイト 1件(製作中)
    ・コーポレートサイト 3案件
    ・アパレルECサイト 新規構築25案件以上(改修・保守運用は除く)

  • SCSS

    SCSS

    SCSSはCSSを効率良くスタイル調整する為のRubyで作られたスタイルシート言語であります。PUGと同じくRuby・node.js・gulpをインストールしてコンパイルする必要があります。
    php・jsのように配列・変数などを用いることができ、(.section-00X)のようなセレクタや(color: whiteなど)よく利用する設定値などにも変数・配列を適用して効率よくスタイルシートを記述するのに適しています。

    成果物CODEPEN
    Nu-Blog
    ・アパレルECサイト 10案件

  • Type Script

    Type Script

    TypeScriptはJavaScriptに対して、省略も可能な静的型付けとクラスベースオブジェクト指向を加えた厳密なスーパーセットとなっております。
    TypeScriptはReact.jsと相性がよく、TypeScriptとReact.jsでサイト制作する会社も増えてきています。

    成果物Nu stack
    ・カレンダー予約サイト(開発中)

  • Vue.js

    Vue.js

    vueはEvan You氏が開発したJavascriptのフレームワークである。デザイナーが「親しみやすい」作りとなっており、UI/UXを高める機能(アニメーション)が容易に導入できます。

    成果物Nu-blog
    ・アパレルECサイトの一部(カウントダウン機能を追加) ・アパレルECサイト 1案件 etc...

  • React.js

    React.js

    React は、Facebookによって開発されているユーザインタフェース構築のためのJavaScriptフレームワークです。
    Reactはシングルページアプリケーションやモバイルアプリケーションの開発におけるベースとして使用することができます。
    また、React.jsの拡張版Next.js・Gatsby.jsも存在しており、このサイトはNext.jsで作成しております。

    成果物Nu stack
    React.js Plactice
    ・カウントダウン機能追加
    ・カレンダー予約サイト(開発中)

  • Nuxt.js

    Nuxt.js

    Nuxt.jsはVueの公式ガイドラインに沿って強力なアーキテクチャを提供するように作られたフレームワークです。
    機能はたくさんあり、サーバーサイドレンダリング・JS / CSS ミニファイ化・ プリプロセッサ・モジュール構造で拡張できるなどいろんな機能があります。

    成果物Nu-Blog

    LT資料Microcms + nuxt.jsで個人ブログサイトをデプロイした件

  • NEXT.js

    NEXT.js

    NEXT.jsは、Vercel社によって開発されたJavascriptのフレームワークであり、Reactベースにしたフロントエンドのフレームワークです。SSR/SSG、ファイルベースルーティング、開発サーバの部分的な高速リロードなど様々な機能を持っています。
    最近ではバージョンが12まで上がり新しい機能や高速化されており世界中の人から注目されているフレームワークです。

    成果物Nu stack
    ・カレンダー予約サイト(開発中)

  • pug

    pug

    pugはHTMLを効率よくコーディングする為のテンプレートエンジンです。SCSSと同様にWebpack・gulpなどでコンパイルが必要になります。
    共通パーツ(ヘッダー・フッター)付きの3ページ以上をコーディングをする時とか、同じコンポーネントを3桁以上コーディングしなければいけない時に適した言語です。

    成果物・アパレルECサイト 1案件
    CODEPEN

  • BASE

    BASE

    BASE(ベイス)は会員登録するだけで誰でも簡単にネットショップが作成できるサービスです。
    気に入ったテーマを選択して、カスタマイズするだけでネットが公開できます。
    また、SEO設定・クーポン・メールマガジン・レビューなど機能が充実でありほとんど無償で機能を追加できます。
    もちろん、オリジナルのサイトを作成することが可能です。
    必要な言語はhtml/css/jqueryです。
    オリジナルのサイトを作る場合は、言語スキルを身につけることが必須なので、未経験の方はテーマ選択・カスタマイズのみで十分でしょう。

    成果物・美容系のECサイト 1案件

  • Word Press

    Word Press

    Word PressはCMSの一つでであり、初学者や未エンジニアでも無料でダウンロードできて適用できます。
    また、お名前.com / Xserverなどのドメイン会社を契約すればサーバー・ドメイン・WPで一気にインストール・有効になりすぐに使えるようになり、世界で一番使用率が高いCMSです。
    Word PressはPHPで開発されており、データベース管理(MySQL)を利用しております。
    成果物・コーポレートサイト 3件
    ・ブログサイト 1件(製作中)
    ・アパレルECサイト 1件
    ・実家の自営業(製作中)

  • Movable Type

    Movable Type

    Movable Typeは日本の企業シックス・アパート社が開発・提供したCMSであります。このCMSの特徴はWordPressのようにデータベースを参照にしてphpで動的処理してコンテンツを出力しているのではなく、このCMSは記事を登録後にhtmlファイルをそのまま生成されるので、データベースを参照せずにいられるのでアクセス負荷にはとてもつよいのが特徴です。

    成果物・Webサイト / アプリと連携する為のRSS作成
    ・HTMLメルマガ作成
    ・LOOKBOOKページ作成
    ・NEWS一覧・詳細CMS化 5件程

  • Micro CMS

    Micro CMS

    Micro CMSは2019年8月にリリースした、初の日本製のヘッドレスCMSです。ほとんどのヘッドレスCMSは英語で記載されているが、Micor CMSは日本語で記載されているため、日本語でチャットサポートが利用できるのが快適です。
    ヘッドレスCMSなのでアカウントを登録するだけで利用でき、管理画面のサーバー管理はは一切不要なのでhtml/css/javascriptの技術があれば誰でも利用できます。

    成果物うえむーブログ
    Nu-stack
    ・アパレルECサイト 1件

    LT資料micro CMSについて
    Microcms + nuxt.jsで個人ブログサイトをデプロイした件

  • gulp

    gulp

    gulpはSCSS・Ejs・minify・スプライト化・pug/phpなどのhtml化などのタスクを自動化してくれるJavascriptツールキットです。
    自分はSCSS・Pugの言語で実装する時に利用します。
    gulpを利用する際はNode.js・npm・gulpの順でインストールし、gulpfile.jsを生成する必要があります。

  • go

    go

    go(go lang)はGoogle社が開発したサーバーサイド言語であり、シンプルで信頼性があり、無駄のない有能なソフトウェア開発を簡単に実現できるように設計されいます。
    ゆえに、実用性があり、効率よく作業を行うことが可能なため、Go言語は「軽量・高速・シンプル」なプログラミング言語として広く知られています。
    goのマスコットキャラクターはgopherであり、日本語で訳すと「ホリネズミ」だそうです。

    成果物github タイピングゲーム

    LT資料・Golang で制限時間付き・ランダム表示のタイピングゲームを作ってみた。

  • Figma

    Figma

    figmaはアカウント登録するだけで利用できる。サーバーレスUX/ULデザインカンプ作成ツールです。
    仕様がXDと少しにており、XDに慣れている方はサクッと使いこなせると思います。
    作成したデザインカンプを仲間に招待するだけで共有することができます。

    成果物・コーポレートサイト 2案件
    NU-stack

    参考資料figma
    チュートリアル

INFORMATION

WORK

Nu-blog

どんな些細でもいいですので気軽にお問い合わせください。
X(旧Twitter)で受け付けております。