Ko

現役エンジニア（フロントエンド） 私大文系→プログラミング・英語独学→数社を経て→35…

Ko

現役エンジニア（フロントエンド） 私大文系→プログラミング・英語独学→数社を経て→35カ国からなる国際的なチームでフロントエンド。 フロントエンドエンジニアに必要なプログラミングのスキル・勉強方法を共有します。 コードを書いていない時は財務諸表を読んでいます。

  • Stock Investment

  • 固定された記事

【チュートリアル】ReactとFirebaseを使ったノートアプリの作り方

これからReactとFirebaseを使ってノートアプリを実装していきます。 対象としているのはフロントエンドの基本的な勉強をしてきたけどどうやってウェブアプリを作ればいいのかわからないといった方を想定しています。 このチュートリアルではReactで実装していくのでReactの知識があることを前提にしています。 さらにブラウザの開発ツールやターミナルも一通り触れることを前提にしています。 またCSSでのスタイリングの部分には触れません。ロジックの部分にフォーカスするためソース

500
Ko

    • ポストBATと呼ばれる中国のテックカンパニーのTMDとは何か？

      こんにちはKosukeeeです。 日本のテック界隈のみなさんであれば昨今のグローバルな潮流として米国のシリコンバレーだけでなく中国のテック界隈も気になってきているかと思います。 そこで今回は中国のポストBATと呼ばれてるTMDについて触れてみたいと思います。 BATというのはすでにご存知かと思いますがバイドゥ（Baidu）、アリババ（Alibaba）、テンセント（Tencent）の企業になりますがTMDというのはこれら中国を代表するテックカンパニーに続く企業と言われていま

      Ko

      • モジュールバンドラーはなぜモダンなフロントエンドの開発に必要なのか？

        本格的にフロントエンドの開発をしていくにあたりモジュールバンドラーの役割を理解しておくことは非常に重要です。 近年どんどん複雑になっていくフロントエンドの開発フローにおいて「コードを書く」というのと同じくらい「開発環境の設定をする」ということが重要だからです。 そこでこのノートではモジュールバンドラーがなぜ必要なのかという観点から解説していきたいと思います。 基本的には私が普段使用しているWebpackを念頭に説明していきます。 モジュールバンドラーとは何をするものなのか？

        Ko

        • ブラウザはどのようなプロセスでページを表示しているのか？

          こんにちは、Kosukeeeです。 今回はブラウザについて取り上げてみたいと思います。 フロントエンドの書くコードは全てブラウザ上で表示されます。 ということはブラウザがどのようにしてページを表示しているのかを理解することが非常に重要になってきます。 特にtoCのサービスに関わっているとUXやSEOの観点からページの表示スピードの改善もタスクの一つになるので表示プロセスに関して理解していることが求められます。 JSやCSSは雰囲気でも書けてしまいますが、ブラウザがDOMや

          Ko
        • 固定された記事

        【チュートリアル】ReactとFirebaseを使ったノートアプリ…

        Ko

        • ポストBATと呼ばれる中国のテックカンパニーのTMDとは何か？

          Ko

        • モジュールバンドラーはなぜモダンなフロントエンドの開発に必要なのか？

          Ko

        • ブラウザはどのようなプロセスでページを表示しているのか？

          Ko

        マガジン

        • Stock Investment
          0本

        記事

          JavaScriptの非同期処理について図を使って説明してみる

          こんにちは、Kosukeeeです。 現在チャットアプリのチュートリアルを準備しているのですが、そこで非同期処理の一連の流れがあったので今回のトピックとして取り上げてみようと思います。 ここでは実際のウェブアプリでの使用例と合わせて解説することでイメージしやすくなるように説明していきたいと思います。 非同期処理の実際の使用例現在作っているチャットアプリではテキスト以外にも画像のファイルデータが送れます。 ここでのフローを詳細に説明すると １：画像を選択して「アップロード」ボ

          Ko

          JavaScriptの非同期処理について図を使って説明してみる

          Ko

          【チュートリアル】HTML/CSS/JSだけで作る音楽アプリ

          こんにちは、Kosukeeeです。 今回はHTML/CSS/JSだけを使って音楽アプリ（瞑想アプリ）を作成していきたいと思います。 フロントエンドの開発を始めたばかりの方やJSを使ってウェブアプリを作成してみたいという方に参考になるように分かりやすく説明していきたいと思います。 まず、これからどういったものを作るのかイメージしていただくためにこちらの動画を確認してみてください。 また下記のリンクから実際に動いているものを触ってみることもできます。 Chromeなどのブラ

          Ko

          【チュートリアル】HTML/CSS/JSだけで作る音楽アプリ

          Ko

          フロントエンドエンジニアになるために理解しておきたい全体像

          今回はフロントエンド開発の全体像を図にしてみようと思います。 多くの方がウェブサービスやウェブアプリを開発することを夢見てフロントエンドの勉強を始めると思うのですが、少ししてから現実に愕然とすることがあります。 それはフロントエンドの開発をするために理解しておかないといけないことが恐ろしいほどにたくさんある、ということです。 そして「何を」「どこまで」知っておく必要があるのかわからなくなります。 そこでこのノートではフロントエンドの全体像を図にしてみようと思います。 よく

          Ko

          フロントエンドエンジニアになるために理解しておきたい全体像

          Ko

          ノートアプリはどのような仕組みで作られているのか？【フロントエンド視点】

          フロントエンドの方が基本的なプログラミングの勉強をしてきて壁に当たる問題の一つが「静的なウェブサイトは作れるけど動的なウェブアプリをどうやって作ればいいのかわからない」という点だと思います。 HTMLとCSSでレイアウトの実装ができるようになって静的なウェブサイトも作れる。JavaScriptでインタラクションもつけられる。 でもウェブアプリってそもそもどういう仕組みになっていてどうやって実装すればいいのか分からくて躓く瞬間があると思います。 対象読者そこでノートアプリを例

          Ko

          ノートアプリはどのような仕組みで作られているのか？【フロントエンド視点】

          Ko