プログラミング

プログラミング初心者必見! 効率の良い学習方法

プログラミング実務未経験からWebエンジニアに転職した私が、様々な試行錯誤の末、行き着いたプログラミングの効率の良い勉強方法を解説したいと思います。 プログラミングと聞くと「なんか難しそう」とか「何から勉強すればいいのかわからない」とか...
データ分析

Python基本的なスクレイピングライブラリ

Web上から自動的にデータを取得できたら便利ですよね。 それを実現してくれるのが、スクレイピング・クローリングという技術です。 私自身、プログラマになる前は小売店の販売データ分析を行っていたのですが、POSデータをWebから落として...
Blog

サクッと導入 WordPressでScssを使う方法

Wordpressでもテーマをそのまま使うのではなく、デザインをカスタマイズしているという方も多いのではないでしょうか。 デザインはCSSで編集を行うと思うのですが、CSSは若干使い勝手が悪くコードの記述が長くなってしまうんですよね。...
キャリア・ビジネス戦略

現代における最強の道具、ブラウザアプリケーション5選

「アプリケーションといえばネイティブアプリでしょ」という時代は終わって、今やブラウザアプリでもネットワーク環境さえあればサクサク使えるようになりました。 ブラウザアプリのメリットはブラウザ(ChromeやSafariなど)があればすぐに...
キャリア・ビジネス戦略

リモートワークは効率的な働き方なのか?

先日からのコロナの影響を受けて、不本意ながらリモートワークを行うことになりました。 私自身は、「他人の目線がない分、自己管理ができず怠けてしまうのではないか」という不安からどちらかというとリモート反対派でした。 しかし、実際に実施してみて...
キャリア・ビジネス戦略

未経験から自社開発Webエンジニアに転職して良かった点・悪かった点

私は「印刷業」、「貿易業」を経て、29歳でWebエンジニアに転職しました。今までのキャリアを捨て、「Webエンジニア」に転職して正解だったか。結論から言ってしまえば「正解」でした。こんなに将来性があって面白い職業は他にはないと思います。...
プログラミング

精神安定剤としての「E2E自動テスト」と「CI(継続的インテグレーション)」のすすめ

アドベントカレンダー私が担当する最後の記事は、アプリの品質を保つ上で最も重要なテストについてです。 以下の記事の続きという前提なので、React+AWSで作成したWebアプリ(SPA)に自動テストのフローを追加するという流れで今回の解説を行います。 AWS Amplify / AppSyncで画像投稿webアプリのサーバサイドを実装する テストと聞くと「あんまやる気でねー」となるかもしれませんが、テストがないとリリース時に常に肝を冷やしながら作業をするはめになるので、そんなリスクを犯すくらい...
プログラミング

AWS Amplify / AppSyncで画像投稿webアプリのサーバサイドを実装する

アドベントカレンダーも中盤に差し掛かってきました。 今回は画像投稿アプリのサーバサイド(ユーザー認証・GraphQLによるAPI通信)をAWSのサービスAmplify・AppSyncを主に活用して実装していきます。 一応、以下記事の続編という形で投稿を行っていますが、途中まではAmplifyとAppSyncの概要説明を比較的シンプルな実装例を用いて行います。 React Hooks ✕ AtomicDesignで画像投稿webアプリのフロントエンドを実装する AWS Amplifyとは ...
プログラミング

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を導入することでどういったメリットがあるのか・どういったことができ...
タイトルとURLをコピーしました