タグ

devに関するginpeiのブックマーク (338)

  • How good is your logo?

    Giacomo Urgeghe Top 1% Logo designer on Upwork The site could be a great tool! especially for newbie designers or even for me who have 20 years of experience to verify that my projects have no design issues. Kiana Rickard Top 1% Logo designer on Upwork This logo tester could really benefit someone who is new to logo design or unfamiliar with the best logo guidelines to follow. This website will pr

    How good is your logo?
    ginpei
    ginpei 2021/06/25
    ロゴの独自性、複数の背景色や縮小時における視認性、色遣いから転用のしやすさ他を評価するツール。類似のロゴを探して見せてくれる。
  • GitHub - google/zx: A tool for writing better scripts

    You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

    GitHub - google/zx: A tool for writing better scripts
    ginpei
    ginpei 2021/05/12
    シェルスクリプトをJavaScriptで書く、みたいなnpmパッケージ。await $`cmd`でコマンド実行して出力を得たり、cdやfetchが簡単だったり、readlineラッパーで入力を得たり。シェル変更可能。npm前提のウェブ系環境で強そう。
  • DocBaseのフロントエンド改修をどのように進めたか

    こんにちは、クレイの阪です。 もともと外部委託パートナーとしてクレイ案件のお手伝いをしていましたが、気づけば中の人となっていました。 よろしくお願いいたします。 先日、DocBaseはフロントエンド構成を Backbone.js+Coffeescript から React.js+TypeScript へ移行しました。大改修です。 どれくらい大きな変更だったかというと、10万行(2500ファイル)もの変更が行われ、それまでRubyだったはずのリポジトリ代表言語がTypeScriptに替わってしまったほどでした。 なお、2021/3/31のリリースでリニューアルすべてが終了したわけではありません。今後、機能拡張やUI改善をしやすくするための足がかりという位置づけです。 安全にリリースするためテスト期間を多めに取ったこともあり、期間としては1年ほどかかってしまいました。 今回はどのようにリニュ

    DocBaseのフロントエンド改修をどのように進めたか
    ginpei
    ginpei 2021/05/11
    『フロントエンド構成を Backbone.js+Coffeescript から React.js+TypeScript へ移行』すごすぎ。しっかり計画立て実施。まず部分的に変更、裏側やE2E試験、UI等は維持、CSSクラスは維持の後CSS in JSへ置き換え、週1で認識合わせ。
  • Next.jsアプリをVercelからGoogle Cloudに移行した話

    ZennではフロントエンドNext.jsを使っています。もともとはVercelで動かしていたのですが、2021年3月にGoogle Cloudに移行しました。今回は移行を決めた理由や、具体的な構成、移行作業などについて書きたいと思います。 なぜ移行したのか Next.jsのデプロイ先としてVercelは圧倒的に優れています。ISRやImage OptimizationといったNext.jsの強力な機能をサーバー側の追加設定なしで使用できますし、CDNでの静的ファイルのキャッシュなども特に意識しなくてもいい感じにやってくれます。 Vercel以外にデプロイするとなると、Next.jsの一部の機能がうまく動かなかったり、パフォーマンス・チューニングを自分で頑張る必要があったりと自分で面倒を見なければならない部分が多くなります。 しかし、Zennのケースでは以下のような理由からVercelから

    Next.jsアプリをVercelからGoogle Cloudに移行した話
    ginpei
    ginpei 2021/03/30
    元々GCP利用なので親和性の向上、依存先の低減、値段。GCPでISRは使えないが近い挙動は実現可能。一部機能や開発環境は先に移行し、負荷試験も済ませ、詳細な手順書を用意して当日のミスを防ぐ。
  • 質とスピード(2020秋100分拡大版) / Quality and Speed 2020 Autumn Edition

    質とスピード(2020秋100分拡大版) 2020/11/20 @ JaSST'20 Kyushu

    質とスピード(2020秋100分拡大版) / Quality and Speed 2020 Autumn Edition
    ginpei
    ginpei 2021/03/10
    質とスピードは対立しない。犠牲になる品質とは保守性等の内部品質。高品質「なのに」ではなく「だから」速い。内部品質への投資は1月程度で回収。『短期的にも長期的にも、崩壊したコードを書くほうが…常に遅い』
  • Gitで日本語長文のdiffをとる方法

    課題 日語の長文をgitで管理していると、ほんのちょっとの変更でも、diffでは行丸ごと変更されたことになり、変更点がよくわからないことがある。 二泊三日で小説を書く過激なイベントNovelJam 2018参加作品である高橋文樹氏の「オートマティック クリミナル」は、GitHubを使って執筆されている。小説では、git diffの欠点がはっきりでる。高橋氏は参加レポートで、こう書いている。 あと、今回得た重要な知見なのですが、Githubではある程度以上テキストが長くなってくると、数文字の調整で全部差分として判定されたりするので、小説には向いてないかなーと思いました。小説は行の移動とかがよく発生するので、GithubじゃなくてGitとの相性かもしれません。 普通にgit diff 確かに、普通にdiffをとるとその通り。コマンドラインで「オートマティック クリミナル」リポジトリの途中経過

    ginpei
    ginpei 2021/03/02
    `git diff --word-diff-regex=$'[^\x80-\xbf][\x80-\xbf]*'`で良い感じに。
  • FirestoreでTwitterのタイムラインを実装する場合のベストプラクティスとは|Nino|note

    規模や実装によりますがSaaSを使った方が楽です。詳しい実装や金額を見ていきましょう。Twitter規模のサービスをベースに話を進めます。 Firestoreのみで実装する場合FirestoreはORオペレーターがないのでタイムラインを実装するにはフォロワー全員のタイムラインコレクションにツイートの参照を追加する必要があります。 たとえば300万人のフォロワーがいるHIKAKINが「おはよう」とツイートした場合、おはようツイートのIDをフォロワー全員のタイムラインコレクションに計300万回書き込む必要があります。 FirebaseのBlazeプランでは1書き込みが0.00018円なので300万回を掛けて540円が費用として発生します。また、通信量やDB容量も嵩むので厳密にはさらにコストがかかります。 逆にタイムライン表示は単に各ユーザーのタイムラインコレクションを呼ぶだけですみます。ノーコ

    FirestoreでTwitterのタイムラインを実装する場合のベストプラクティスとは|Nino|note
    ginpei
    ginpei 2021/02/08
    多対多をFirestoreで実装する場合、外部サービスのAlgoliaも選択肢に。「利用者4500万人、平均300人のフォロワー、毎日3ツイート、10回のタイムライン表示」という条件ではAlgoliaが有利。保守性も高いとのこと。
  • RFC 7807: Problem Details for HTTP APIs

    Internet Engineering Task Force (IETF) M. Nottingham Request for Comments: 7807 Akamai Category: Standards Track E. Wilde ISSN: 2070-1721 March 2016 Problem Details for HTTP APIs Abstract This document defines a "problem detail" as a way to carry machine- readable details of errors in a HTTP response to avoid the need to define new error response formats for HTTP APIs. Status of This Memo This is

    RFC 7807: Problem Details for HTTP APIs
    ginpei
    ginpei 2021/02/06
    ウェブAPIのエラー詳細を伝達するJSON仕様。通常のHTTPステータスコードのみでは情報が不足(例:何故403なのか、どう解決するのか)なので、詳細を本文へ埋め込む。typeに詳細URL、titleに人が読める概要、等。
  • 質の高い技術文書を書く方法 - As a Futurist...

    大学や大学院で論文の書き方を鍛え上げた人たちには遠く遠く及ばないが、僕の様なはぐれもの1でも最近は Amazon 社内で文書の質が高いと評価してもらえるまでにはなった。Software Engineer として、コードでのアウトプットはもちろん大事だけど、文書のアウトプット(およびそれによって得られた実際のアウトプット)は同じだけ重要である2。今回は自分が最近どういうところに気をつけて技術文書を書いているのか、ということについて数年後の自分が忘れてないことを確かめられる様にまとめておく。 そもそも文書とは? 英語だと document。ここで指す(技術)文書とは、人間が読む文体で書かれた技術に関連する情報、といったものだ。具体的に言うと以下の様なものを想定している: 新しいプロジェクトの骨子を説明する資料 会議の叩き台となる 1 枚ペラ 番環境に変更を加えるにあたっての包括的な情報や具体

    質の高い技術文書を書く方法 - As a Futurist...
    ginpei
    ginpei 2021/01/28
    文書の目標を定める、結論から始める、課題を明示する、定量的な表現を用いる、選択肢を網羅、自身の意見を述べる、とか。良いまとめ。
  • EStimator.dev: the modern JavaScript savings calculator

    Enter a website URL Find out how much turning on modern JS could save.

    ginpei
    ginpei 2021/01/26
    JavaScriptを現代的な記法へ変換した場合にどの程度ファイルサイズを減らせるか、URLを入力すると計算してくれるサイト。Google Chromeチーム開発。
  • GitHub - unicode-org/last-resort-font: Last Resort Font

    This repository includes two versions of the Last Resort font: Last Resort and Last Resort High-Efficiency. Although both fonts can be installed at the same time—because they have different names—you are encouraged to download and install only the one that is expected to work in the environments that you use: The file LastResort-Regular.ttf is a font named Last Resort, and its 'cmap' table include

    GitHub - unicode-org/last-resort-font: Last Resort Font
    ginpei
    ginpei 2021/01/22
    文字が豆腐になったとき何が欠けているのか判断できるようにするフォールバック目的のフォント。Releasesからダウンロード。商用利用可能。
  • Squoosh

    SmallSmaller images mean faster load times. Squoosh can reduce file size and maintain high quality. SimpleOpen your image, inspect the differences, then save instantly. Feeling adventurous? Adjust the settings for even smaller files. SecureWorried about privacy? Images never leave your device since Squoosh does all the work locally.

    Squoosh
    ginpei
    ginpei 2021/01/12
    画像を圧縮してファイルサイズを減らすツール。オンラインから使えるウェブアプリでありインストールできるPWAの実践であり、そしてwasmの利用例でもある。
  • 管理者用初期化URLを踏んでWebサービスのデータをふっとばした話 - Qiita

    自己紹介 職のエンジニアではありませんが、ちょっとICT系に詳しそうなやつって感じで、部署のサーバ管理を任されたりもしています。 背景 私の(当時所属していた)部署では、毎年、数週間かけて前年の各人の業務実績をとりまとめて一つの冊子(PDF)にするという仕事があり、この作業を少しでも自動化するため、Webサービスが内製されました。当初は単純に各ユーザが自分の業務実績一覧をテキストで用意してアップロードするというものでしたが、秘伝のタレのように毎年少しずつ改良されたり、大幅に作り直されて別システムから業務データを取り込んでからブラウザ上で編集できるようになったりしつつ、なんやかんやあって私が引き継ぎます。他にやりたい人もなく、ひとり鯖管です。OSはCentOS6でした。 このシステムでは、毎年新しいデータを編集するため、その作業開始時にデータを初期化する必要があります。この作業も自動化し、

    管理者用初期化URLを踏んでWebサービスのデータをふっとばした話 - Qiita
    ginpei
    ginpei 2020/12/08
    単純なGETで全削除という欠陥で。復旧の手際が鮮やか。まず数日前のバックアップは確保。httpd等を止めアクセスを最小限に。ddでディスクイメージ作成、これをsshで実行し手元に保存。extundeleteで復元。予行演習したい。
  • Semantic Versioningの闇 - knqyf263's blog

    今回も誰も興味ないシリーズなので今まで書いてこなかったのですが、Semantic Versioningに関して幻想を抱いている人がいる可能性があり、そういう方にどうしても現実を知っておいて欲しかったので書きました。3行要約(と可能なら余談)だけでも読んでいただけると幸いです。 3行要約 Semantic Versioning 2.0.0にはバージョン"比較"の定義はあるが、バージョン"制約"(>= 2.1.3みたいなやつ)の定義がない その結果、同じsemver準拠ライブラリでも制約の解釈が異なり結果が真逆になる というかそもそもsemver使ってるエコシステムが少なすぎる 背景 セキュリティアドバイザリでは特定のバージョンが脆弱であることを示すためにバージョン制約が使われることが多いです。例えば >=1.2.0 <1.2.6みたいなやつです。この場合、1.2.5は脆弱だが1.2.6は修正

    Semantic Versioningの闇 - knqyf263's blog
    ginpei
    ginpei 2020/11/11
    冒頭の要約にもあるようにsemver自体ではなくそこに範囲(>=1.2.3とか)の仕様がない闇。ライブラリーごとに独自解釈され差が出てしまう。前半はsemverに似た別のバージョン表記仕様の話。
  • Microsoft Edge Tools for VS Code - Visual Studio Marketplace

    Microsoft Edge Developer Tools for Visual Studio Code This extension allows you to use the Developer Tools of Microsoft Edge inside Visual Studio Code. Features: Live analysis of issues in your source code - find out about problems while you develop Browser preview with built in toolbar for device and mode emulation Changes in the Styles tool sync live with your source code - including abstraction

    Microsoft Edge Tools for VS Code - Visual Studio Marketplace
    ginpei
    ginpei 2020/10/30
    VS Codeの中でEdgeの画面とDevToolsのElementパネルが動く拡張。--remote-debugging-port=9222なChromeへも接続。Element以外はなし。(Scripts系は標準のDebugからやれる。) Stylesから直接ファイルを開いたりできる。Source maps対応してない?
  • 「この位置にprintfが無いとなぜか動かないんだ。」 - Qiita

    はじめに 先日ツイッターで見かけた呟き pic.twitter.com/33Yk02hu1U — TOMO (@tomozh) October 14, 2020 そういうこともあるのか的な反応もあるようなので具体例を挙げてみることにする。 例1 所謂FizzBuzz問題。 #include <stdio.h> void fizzbuzz(int n) { int next; int i = 1; do { printf(i % 15 ? i % 5 ? i % 3 ? "%d\n" : "Fizz\n" : "Buzz\n" : "FizzBuzz\n", i); if (i++ >= n) next = 0; } while (next); } int main(void) { printf((char[]){""}); // この位置にprintfが無いとなぜか動かない fizzbuz

    「この位置にprintfが無いとなぜか動かないんだ。」 - Qiita
    ginpei
    ginpei 2020/10/20
    未初期化変数とバッファオーバーランの周囲でprintf()を利用して意図的に「たまたま動く」状態を用意した例。前者は関数呼び出しで未初期化領域が非0で埋まることを期待、後者は壊れても影響のないバッファを配置。
  • Markuplint - An HTML linter for all markup developers. | Markuplint

    Conformance checkingThe markup needs to written valid code. This is important to keep the promise of the standards that do not break webpages through each user agent. Markuplint can conformance checking given the specs that are HTML Standard, WAI-ARIA, and more. On Your House RulesYou may have the house rules on your project or your organization. You can check based on your policy or your manageme

    Markuplint - An HTML linter for all markup developers. | Markuplint
    ginpei
    ginpei 2020/10/01
    HTMLのlinter。IDや属性の重複といった凡ミスやul>divのように不正な構造を検出してくれる。インデントやタグ名の大文字小文字といったスタイルも。
  • 価値あることを「社内ボランティア」にしない - Automagic Podcast 感想|はのめぐみ

    こんにちは!はのめぐみです。 先週末に「がんばっている活動をアクセシブルにしてほしい」というポッドキャストを聴きました。約1時間の会話の中にアクセシビリティ活動に関するアプローチのヒントがたくさん詰まっていて、とてもいいポッドキャストでした。 ここで語られていたことは、たしかに「アクセシビリティ」を文脈にした内容です。私が持った印象としては、「アクセシビリティ」はあくまで変数のひとつにしか過ぎず、あらゆる場面において応用可能な組織デザイン論のような気がしました。 ポッドキャストの要旨 「ひとりで頑張る」から「チームで取り組む」に至るまでに遭遇する様々な「壁」。それを乗り越えるためにどのようなプロセスをたどればいいのか。株式会社サイバーエージェントでウェブフロントエンドデベロッパーとして働く桝田草一さんをゲストに迎え、主催の長谷川恭久さんが番組を進行します。 課題 取り組みを簡単に始められて

    価値あることを「社内ボランティア」にしない - Automagic Podcast 感想|はのめぐみ
    ginpei
    ginpei 2020/07/29
    ポッドキャストを聞いた人の感想。組織作りの話。指標を策定することで道標として開発者を導き、自分ごと化させて巻き込む。
  • namae — name new project

    Check availability of your new app name for major registries at once.

    namae — name new project
    ginpei
    ginpei 2020/07/27
    かぶってない名前を探してくれるツール。ドメインの他TwitterやGitHubのアカウント、npmやRubyGemsのパッケージ等々を横断検索して結果を表示。
  • ローカル開発環境の https 化 | blog.jxck.io

    Intro Web の https 化が進み、それに伴って https を前提とする API も増えてきた。 そうした API を用いた開発をローカルで行う場合、 localhost という特別なホストを用いることもできるが、それだけでは間に合わないケースも少なからずある。 localhost を https にするという方法もあるが、そのように紹介されている方法には、いくつか注意すべき点もある。 この辺りの話を、直近 1 ヶ月で 3 回くらいしたので、筆者が普段使っている方法や注意点についてまとめる。 特に推奨するつもりはない。 Update chrome の --host-rules について追記 localhost での開発の注意点 例として https://example.com にデプロイする予定の ServiceWorker を用いたアプリがあったとする。 開発をローカルで行う

    ローカル開発環境の https 化 | blog.jxck.io
    ginpei
    ginpei 2020/06/30
    本物の(サブ)ドメインで証明証を発行し、DNSで向き先を127.0.0.1にする。手元のhostsはいじらない。たしかに確実で便利そう。でもDevToolsとかでうまいことやれるようになってほしい。