はじめに としが明け、2023年になり、2022年を振り帰ったり、今年の目標を立てている頃でしょうか？ みなさんは2022年どんな1年でしたか？ この記事では、2022年に話題になったWebサイトをまとめて、 みなさんの振り返りや今年の目標や勉強することの参考にしてみてはいかがでしょうか？ POLA https://www.pola.co.jp/wecaremore/mothersday/ 母の日に合わせて公開された↑この特設サイトは、スクロールに合わせて、だいぶスムーズに花がアニメーションしていくサイトです。 一回サイトに訪れると、その没入感にサイトから抜け出すタイミングがなくなるでしょう。 Pokémon Online Gallery https://onlinegallery.pokemon.co.jp/ja/ ポケットモンスター スカーレット・バイオレットの発売を記念して公開された

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ほとんどの人はだれかと恊働しています。マネージャーやリーダーであるなら、この割合はより大きくなります。 筆者は、仕事の重要な要素のひとつを「進捗を出すこと」と定義しています。そして進捗を出すには、進捗をただしく把握することも重要になってきます。 しかし「進捗を把握する」と言っても、想像以上に難しいと感じる場面が多々ありました。たとえば、 進捗はどうですか？ → 進行中です／〜をやっています なにか問題はありますか？ → とくにないです 〜までに終わりそうですか？ → たぶん大丈夫だと思います というようなやりとりは一般的なコミュニケーシ

はじめに 『レンダリングの仕組みなんて知らなくても、ブラウザが勝手にやってくれるじゃん！』 当時駆け出しのエンジニアだった私はそう思っていました。 実際、当時の私はレンダリングの『レ』の字も知りませんでしたが、特に業務上で問題はありませんでした。 しかし、その時は突然訪れました。 クライアントの要望でアニメーションを多彩に取り入れた案件を実装した際に、テスト段階で一部ブラウザ（S○f○ri、E○ge）でアニメーションがひどい状況になっていることが発覚しました。 (開発中はChromeで確認を行っており、Chromeでは特に問題はなかったので発覚が遅れました。) それからは、狂ったようにパフォーマンスの改善方法をググり、修正する日々が続きました。（最終的には、なんとかマルチブラウザでの動作も担保し、納品まで完了しました。） その案件が落ち着いた後、改めて自分の調べたことを振り返ると、局所的な

この学習計画について更新しています。 データ分析に欠かせない五つの考え方【データ分析手法をたくさん知っても活用できない根本理由】 誰でもすぐわかるデータベース基礎の基礎~ 初心者が押さえておくべきSQLガイド データ分析をやっても無駄？実例から見る本当のデータ分析～【連載-1】 データ分析をやっても無駄？実例から見る本当のデータ分析～【連載-2】 ダッシュボードを作ってみたらそんなに難しくない 業務知識すら知らないとデータ分析をやれないでしょう【連載-1】 業務知識すら知らないとデータ分析をやれないでしょう【連載-2】 データ分析に最低限押さえるべき10つのビジネスフレームワーク 「文学系の人はデータ分析に向いていますか」 「プログラミング経験がありませんが、データアナリストになれますか」 「データ分析を勉強するなら、RとPythonを勉強しなければならないですか」 などはよく聞かれる話で

Vuexについて、とりあえず必要ないしなんだか分かりづらいからと使わないでいたのですが、 この度いざ使ってみたところ、最初こそ引っかかるもののの、結構すんなりはいってきました。 ただ、この「最初こそ引っかかる」部分ができる人にとっては些細すぎるし、 引っかかって躓いてしまう人にとっては大変な部分だと思うので、 コードのどことどこに関連があるのか図解してみようと思います。 まずは、よくVuexの説明ででてくるこのイラストを見てほしいのですが、 私は一度にたくさんの要素が出てきすぎてしまって、一旦理解するのを後回しにしていました。 しかし、順を追っていけばそんなに難しくなさそうなので、この記事を書いてみました。 実際にシンプルなカウンタを作ってみたので、このコードを図解してみましょう。 サンプルコード コンポーネントとストアのサンプルコードは下記になります。 <template> <div i

本題のチートシートはこちら PNG SVG https://d.kuku.lu/6b5cc7b0a9 から DL できます 作った理由 git って他人に概念を説明するのって難しいし、自身も何度も反復させないと定着しなかったなあという感覚を持っていたので作ってみました 所感 こちらの Git チートシートですが、この中に盛り込めなかった内容で 第2段 を作成しようか考え中です 皆さまのオススメの便利コマンドとか、この内容は必須だろ！的なものがあればをご教示いただければ幸いです もし誤りがあれば、作者の心が折れない程度にご指摘いただければ幸いです あとがき ここまで反響を頂けるとは思っておらず、嬉しい限りです・・・本当にありがとうございます・・・！！ また、図は全て自作です。図における言語は英語、説明は日本語、と言う形に統一しました。（吹き出し部分だけ日本語になっていたのでこちらは修正しまし

「記事を書いてみたものの文字ばかりで味気無い」、という時にちょっとだけ変化を付けられる（...かもしれない）ビジネスマンの画像をつくってみました。 GitHubに上げたので、よかったら使ってみて下さい（記事以外でも使えるかもしれません）。 吹き出しに一言付け加えて記事の合間に配置すると、アクセントになると思います。実際にこれを使って書いた記事がこちらです。このようなストーリー性のある記事には使えるのではないかと思います。 絵の下に何をしているところかを表す作者（私）の意図を書きましたが、これに必ずしも従う必要はありません（見え方が曖昧なものも多いので）。 効果的に使用するには、以下のようなことに気をつけてください。 使い過ぎない 吹き出しを付ける場合は、言葉は短くする 拡大・縮小しすぎない ちなみに全てPower Pointで一からつくっています（これをつくりたいので、Power Poin

『我が名は神龍……どんなテストもひとつだけ自動化してやろう』 じゃ、じゃあ！このブラウザテストを自動化してください！ Chromeで https://kids.yahoo.co.jp/ にアクセスして 検索ワードに ねこ と入力して さがすをクリックして 検索結果にネコ - Wikipedia が含まれていることを確認して 検索結果に 買い方 を追加して さがすをクリックして 探しているのは「猫の飼い方」？と表示されることを確認して クリックすると猫の飼い方で再検索されて 検索ボックスを不倫で上書きして さがすをクリックして このページは表示できませんと出ていることを確認 『よかろう……たやすい願いだ』 まずはライブラリのインストールと初期設定をしてやろう…… # [ライブラリのインストール] # CodeceptJSとPuppeteerをインストールします。nodeとnpmが必要ですので

はじめに ソフトウェアエンジニアリングマネージャ（以下、EM）に求められる責務は、多岐にわたっています。 流動性が高いITの業態である一方、日本型メンバーシップ雇用と米国型のJD型雇用との隙間にあって、責務と権限の曖昧な状況の中に置かれることも少なくないように思われます。 このような状況下で、メンバーからも経営からも双方にそれぞれの考える理想的なマネージャであることを求められることもしばしばあるようです。結果として、マネージャの休職など精神的なストレスも高さが問題になっています。 また、ソフトウェアエンジニアにとって、プログラミングにおけるスキルとくらべ、マネジメントに対するそれのモビリティ（会社を変えても有効であると思える程度）が低く見えると言ったことから、ソフトウェアエンジニアにとってキャリア形成に効きづらいのではないかと考えてしまうことも自然なことです。 その結果、ソフトウェアエンジ

はじめまして。yamaimo (@yarnaimodev) です。Qiita 初投稿...というかネット上にちゃんとした記事を上げるの自体初めてな気がします。 1998 年生まれで、プログラミングとか Web デザインは独学で 3 年ぐらいやってます。TypeScript / Firebase / Node.js / React あたりが特に好きです。 この前 coliss で紹介された Can't Unsee を試してみたら 1 回目が 7,630 点、2 回目が 7,930 点でした。1 小規模ですが Mastodon インスタンスを管理してます。あと Helix キーボード をこの前組み立てた2んですがキー配列を変えたのがなかなか覚えられなくて死んでます。 開発環境は基本的に WSL + Hyper + fish shell と VSCode です。 今回 Puppeteer を使っ

なぜ今までのDNSでは問題があるのか インターネット上の通信の多くは、ブラウザを利用したウェブによるものです。 セキュリティ向上のため、GoogleやFireFoxといった大手ブラウザベンダーが平文通信であるHTTPから暗号通信であるHTTPSへの移行を推奨し、盗聴・改竄・なりすましといった問題を解決することが出来ます。 しかしながら、そのHTTPS通信をする前のDNSによるドメイン解決は暗号化されておらず盗聴でアクセスするホスト名を把握される、なりすましで偽の応答を返されるといった可能性があります。 それを防ぐための方法の1つが、DNS over HTTPSです。 DNS over HTTPSとは 今までDNSサーバ（フルリゾルバ）の（主に）UDPポート53番に対して行われていたDNSによる名前解決を、TCPポート443番に対するHTTPS(HTTP/2 over TLS)通信上で行うプ

はじめに Kaggleで使えるPandasの使い方を備忘録として残します。 随時更新していく予定です。 更新：2019年1月29日15時　様々なコンペで使える便利な関数を追記しました。 Pandas Basics Cheat Sheet(基本的な使い方) [引用]https://becominghuman.ai/cheat-sheets-for-ai-neural-networks-machine-learning-deep-learning-big-data-678c51b4b463 プログレスバーを表示する df.apply()やdf.map()の進捗を見たい時に、 tqdmというライブラリを使うことでプログレスバーを表示することができます。 import pandas as pd import numpy as np from tqdm._tqdm_notebook import t

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? はじめに この半年くらいで初めて本格的にチーム開発を行い、今では日常的に GitHub の Pull Request を使っています。 チームの方々には、基本的なことから応用的な部分まで様々な観点からレビューをしてもらって、大いに勉強になりました。 ただ、時には「新人にとっては厳しいレビュー」をいただき、1 人で傷つきモチベーションを落とすこともありました。 もちろんそれは悪意のあるものではなくて、新人とレビュワーのスキルのギャップによって意図せず生み出されてしまうものです。 そのような不幸なレビューによって苦しむ新人が減ることを願って

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? NTTテクノクロスの上原です。 業務では、社内情報のReact製自前キュレーションサイトの構築を担当しています。 この記事はNTTテクノクロスAdvent Calendar24日目の記事であり、社内の勉強会で発表した内容をQiita記事として書きなおしたものです。タイトルは釣りです。 (2018/12/28追記あり) 導入 記事を書いた理由 Gatsby.js(以降、Gatsbyと表記)はさまざまな高速化テクニックを用いた「爆速サイト生成」で有名なツールですが、そのリッチな機能性は、たとえばイントラ内サイト、業務システム開発、ツール開発

これはクソアプリアドベントカレンダー20日目の投稿です。 「猫が仕事を邪魔してくる〜ww」とかいうアレ なんなんだ？なんなんだお前ら。「猫が仕事邪魔するんだよ〜ｗｗｗ」っていいながらめっちゃ良い写真撮りやがって。あまつさえそれをSNSに流しやがって…！！困ってねえだろ！！明らかにエンジョイしてるじゃねーか！！！くそっ！！！！！俺も猫飼いたい！！！！！！ そうは思いつつ現実はやっぱり気軽に猫を飼うのはいろいろな都合があり簡単にはいかないものです。 であれば、エンジニアたるもの技術で願いを叶えましょう。 猫が仕事を邪魔してくるChrome拡張を作りました あ〜〜〜邪魔されるわ〜〜〜猫に仕事邪魔されるわ〜〜〜〜っかぁ〜！！ こうして願いをかなえることができました。 仕事を邪魔してくる猫たちと実装内容をちょっと解説 技術的にはまったく大したことはしていないのですが、ちょこちょこと小技を使っているの

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? この記事は，武蔵野 Advent Calendar 2018 の8日目の記事です． まとめ HackMD (CodiMD) のスライドモードの解説です． 下記のようなプレゼン資料（スライド）を作る方法について述べます． CSSを変更することで，デザインを変更できます． CSSを全く知らない場合でも，Progate で1-2時間くらいで学習できます． 以下のように，Markdown（テキストベース）でスライドを作ることができます． UML図によるガントチャートや，MathJaxによる数式もテキストで書くことが可能です． PowerPoin

Nuxt, netlify, Firebase を使ったWebサービス開発と個人開発における技術選定のポイントJavaScriptsentryFirebaseNetlifyNuxt 技術構成はこんな感じで作りました。 Nuxtというよりかは個人開発における技術選定のポイントを主体に解説した記事です。 これから個人開発をやろうとしている人の参考になれば幸いです。 どんなWebサービス？ Google Calendar の表示/非表示を一括で切り替えるWebサービス。 ※ゲームとかでよくある装備マイセットのGoogleカレンダー版です。 G Suite を導入している企業だとカレンダー画面が会議室や他のユーザーの予定で溢れてしまいます。 TV会議ができる会議室のセットや同じチームメンバーのカレンダーセットをつくり、セットごとの予定をカレンダーのTOP画面で目視で確認できるようになります！ 触っ

これを見ても、「ふーん」くらいで終わってしまい、特に傾向とかは見つけられないと思いますが、これを地図上にプロットしてみるとどうでしょうか？ ユーザー数の大小を色の強弱で表していて、ユーザーは東北地方に集中していることが瞬時にわかります。 このように、数字の羅列を眺めているだけではわかることは僅かで、理解するのにもとても時間がかかりますが、可視化の力を利用すると一目で問題点の特定や、データの特徴を把握できます。 これを実務に置き換えると、KPIなど重要な指標を時系列でモニタリングすることで、 何か施策を打った時の効果を測定する 現状に異常な変化が起こっていないか監視する 周期性などデータの特徴を理解する などが可能になり、データ活用の地盤ができてきます。 下記の参照記事でも書いてありますが、組織にデータ活用を浸透させる第一歩は、現状の可視化をすることによって問題点、活用状況など含め、現状を理

ブログやってます。更新などはこちら。地方エンジニアの学習日記 七行プログラミングとは プログラミングの言語を問わず、 「7行 × 79文字 」という文字数制限のもとにコードを書くといったこと ショートコーディングと呼ばれるらしいです。 1kbに満たないソースでテトリスが出来るのには感動しました(当時中学生ぐらい) Unix哲学の「スモール イズ ビューティフル」もびっくりです()。 ちなみにスーパーマリオブラザーズは40kb程っていうのも驚き ショートコーダー(Short Coder)とは、プログラムのソースコードを極限まで短縮する技術を持ったプログラマのことである。「ソースコードの短縮」は、一見無意味に感じられるかもしれない。しかし最短コードを達成するには、省メモリ・高速プログラム・処理系の知識に加えて、並外れた集中力と熱いショートコーディング魂が必要なのである。 以下に見つけたソースを

HTML5 Conference 2018 の登壇資料のまとめです。 資料を発見次第随時アップデートしていきます。 HTML5 Conference 2018 https://events.html5j.org/conference/2018/11/ 2018年11月25日（日） 東京電機大学 千住キャンパス 1号館 タイムテーブル https://events.html5j.org/conference/2018/11/session/ ハッシュタグ 総合: #html5j ホール（2階）: #html5j_h 各ルーム（1階:A-C/2階:D,E）: #html5j_a #html5j_b #html5j_c #html5j_d #html5j_e セッション ZOZOのグローバルECのフロントエンドアーキテクチャ設計　（権守健嗣さん） 光を超えるためのフロントエンドアーキテクチャ （