プログラミング

React Hooks ✕ AtomicDesignで画像投稿webアプリのフロントエンドを実装する

FigmaとStorybookで作成したプロトタイプを実際にReactで実装していきます。 (プロトタイプ、アプリイメージについてはこちらの記事に詳細を投稿しています。) Figma ✕ React Storybook で作るプロトタイピング & スタイルガイド Reactに関しては、技術の入れ替わりが激しく「3ヶ月前に採用したモジュールがすでにdeplicatedになっている」なんてことはざらにあります。 そんななかReact 16.8から導入されたのが、Hooksです。公式曰く ...
プログラミング

Figma ✕ React Storybook で作るプロトタイピング & スタイルガイド

アプリを開発する前に予め、開発の全体像を把握するためにプロトタイプを作成します。 プロトタイピングツールで作成したUIは、実際のアプリ開発にも流用できるため効率的です。 今回は簡単な写真共有Webブラウザアプリを制作すると仮定して、 プロトタイピングツールFigmaでプロトタイプ作成 Reactコンポーネントへの落とし込み Storybookでの管理 という一連の流れを実際に実装しながらFigmaやStorybookを導入することでどういったメリットがあるのか・どういったことができ...
キャリア・ビジネス戦略

Thinking of DevOps 生産性の向上についての考察

開発の現場で働いていると、お客様からの要望をどれだけ早く安全にシステムに反映させるかが重要になってきます。ここで重要になってくるのがDevOpsの概念ですが、この考え方はシステム開発のみだけでなく何かを生産するという工程を挟む仕事をして...
プログラミング

ReactJSによるフロントエンド開発

私は普段reactJSというライブラリを使いwebアプリケーションの開発を行っています。様々な機能を実装するなかで react楽しい! react最高! なんて思っているのですが、reactの何が良いのか自分でもはっきりわかってないとこ...
キャリア・ビジネス戦略

最新テクノロジートレンド 2019

最新の技術トレンドは年々変化が早く、昨年までは主流だった技術が今年にはすでに廃れているという時代になってきました。新しい技術を常にキャッチアップしていかないと、すぐに時代遅れになってしまい、技術負債を抱えてしまうという。ある意味大変ではあ...
Git

バージョン管理のスタンダードgitコマンドを使いこなす

Gitはいわずと知れたバージョン管理ツールですが、非エンジニアにとってはなかなか概念が掴みづらく理解が難しいかと思います。それでも、学習するだけの価値はあると考えています。私もexcelファイルを管理するとき、ファイル名20190505...
プログラミング

サーバサイドjavascript実行環境Nodejsとは

javascriptはフロントエンドで使用する言語というイメージが強いのですが、nodejsなどのプラットホームを使用することによりjavaやrubyのようにサーバサイドのプログラミングも可能になります。今トレンドになっているSPA(シ...
プログラミング

Railsアプリケーションを構築するための
MVCモデルとは

Copyright © 2006, Yukihiro Matsumoto MVCモデルとは、アプリケーションを構築するためのフレームワークのようなもので、MVCモデルを使用することでアプリケーションを3つの役割に分解することが...
プログラミング

Rubyで学ぶ クラスとインスタンス

Copyright © 2006, Yukihiro Matsumoto プログラミングで一番理解が難しい概念がクラスとインスタンスではないでしょうか。私もこの概念について理解するのにかなりの時間を費やしました。まだ十分に把握...
プログラミング

Webでもスマホでも
どこでも使えるJavascriptの基本

javascript Logo by W3C javascriptとは世界で最も多く使われているプログラミング言語です。javascriptはwebサイトでもスマホアプリでも、デバイスを選ばず開発が進められる万能な言語だからで...
タイトルとURLをコピーしました