CSSコーディングに役立つサービスやWebサイト運用で役立つSEO関連のツールなど、Web制作の現場で使えるWebサービスを13個紹介します。ワンクリックで取得できるコードや、ドラッグ&ドロップだけで完結するものなど、直感的に作業できるサービスばかりです。あなたの現場でもぜひ利用してみてください。 Fancy Border Radius Generator CSSのborder-radius を使ってボックスや画像をユニークな形状に変化できるWebサービス。 Fancy Border Radius Generator シンプルなコードで実装可能です。 正方形の写真をCSSで変形させました 上のように正方形の写真をユニークな画像に見せることができます。 Fancy Border Radius Generator Clippy – CSS clip-path maker CSSのclip-pa
実践データサイエンス─サンプルコードと図表で学ぶ、前処理・モデル評価・パラメータチューニング - エンジニアHub｜Webエンジニアのキャリアを考える！
実践データサイエンス─サンプルコードと図表で学ぶ、前処理・モデル評価・パラメータチューニング 実践とともに、データサイエンスに入門しよう！敷居が高いと思われがちなデータサイエンスですが、データの前処理からの手順は意外とシンプルです。本記事では、データの前処理や特徴量の作成、モデルの評価・訓練、ハイパーパラメータの調整など、基本的な知識をサンプルコードと図表を見ながら学びます。 データサイエンティストとしてのスキルを向上させるには、データの前処理や特徴量の作成、モデルの評価・訓練、ハイパーパラメータの調整など、広域にわたる知識を身に付ける必要があります。 この記事は、そうした知識を「サンプルコードと図表を見ながら、分かりやすく学習できること」を目指して作成されました。記事内では、新米データサイエンティストのOさんが登場して、ある案件のデータ分析を担当します。読者のみなさんも、ぜひOさんと一緒
こんにちは。Qiita Zine 編集部です。 2019年も残りわずかとなりました。 年末年始休暇には、読書をされる方も多いのではないでしょうか。 この記事では、先日Qiitaメルマガで行った『Qiitaユーザーが選ぶ、2019年に読んで良かった技術書』アンケートの結果を、選出理由を交えて紹介します。 ぜひ、ご自身へのクリスマスプレゼントや、年末年始の読書のお供の参考にしてください💁♀️
私はクラウドのプロダクトチームで働いているが、何を隠そう一番苦手で克服できていないことが、コードリーディングだ。ものすごーく時間かかるし、時間かかったうえに読み間違えたりするし、しかもめっちゃ頭使うのに他の人はずっと速いので敗北感しか残らない。先日もマネージャの Pragna に相談したら、最初は２時間かかるけど、３か月もしたら５分で終わるわよ。って言われたけど、いや、そもそも俺４時間は最低かかるねんけどな、、、って感じ。 技術イケメンの皆さんのアドバイス よくよく私のキャリアを考えると、OSSにコントリビュートとかしていることはあったが、めっちゃくちゃ巨大でややこしいコードベースを読んで理解する必要が無いことが多かった。１からコードを書くのは得意だが、他の人のを読んでがっつり理解してとか、どうやったら出来るのかわからない。 当然自分の周りの技術イケメンの皆さんにコツを聞いていたのだが、ど
グラデーションを作成した時に、中央がグレーに濁ってしまうこと（グレーデッドゾーン）があります。なぜこの現象が起こるのか、どうすれば回避できるのか、鮮やかで美しいグラデーションをCSSで実装する方法を紹介します。 Make Beautiful Gradients in CSS by Josh W Comeau 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 はじめに CSSグラデーションが算出される仕組み おすすめのカラーモード これらの知識を活用する 美しいグラデーションを生成できるツール 終わりに はじめに さっそくですが、CSSで実装したイエローからブルーの線形グラデーションをご覧ください。
良いコードを書くための8つの習慣
成功者がどのようにNew Relicを使用してKubernetesのパフォーマンスを4倍に向上させ、拡張性とスループットを改善したかをご覧ください。
Google、ORMが生成するSQLが遅いときの調査を容易にする「sqlcommenter」をオープンソースで公開。Rails、Spring、Djangoなど主要なフレームワークに対応
Google、ORMが生成するSQLが遅いときの調査を容易にする「sqlcommenter」をオープンソースで公開。Rails、Spring、Djangoなど主要なフレームワークに対応 SQL文を直接書かなくとも、自動的にSQL文を生成、実行してくれるORM（Object-Relational Mapper）は、プログラミングを容易にしてくれる技術としてRailsやHibernate、Springなどさまざまなフレームワークなどで活用されています。 一方で、ORMが生成するSQL文はときに複雑に、あるいは非効率なものとなり、データベース処理の遅さにつながることもあります。 このとき、SQL文の生成と実行を明示的にコードとして記述する必要がないというORMの特徴が、なぜデータベース処理が遅くなったのか、どのようなSQL文が生成され、そのどこに原因があるのか、といった調査を難しくている面があり
低レイヤの知識の重要性は今後も変わらない - 小崎資広に聞くLinuxカーネル開発の裏側 - エンジニアHub｜Webエンジニアのキャリアを考える！
低レイヤの知識の重要性は今後も変わらない - 小崎資広に聞くLinuxカーネル開発の裏側 Linuxは、世界でもっとも広く使われているソフトウェアのひとつであり、多くのエンジニアの仕事に密接に関わっています。では、Linuxそれ自体は、どのように開発されているのでしょうか。Linuxの中枢である、Linuxカーネルの開発者のひとりである小崎資広さんに、知られざる開発の裏側を聞きました。 オペレーティング・システムLinuxは、世界でもっとも広く使われているソフトウェアのひとつであり、オープンソースというカルチャーが生み出した、大きな大きな結実です。サーバー用OSとしてはデファクトと呼べるほどの普及を見せており、それだけにLinuxの動向がもたらす影響は広範にわたります。こうした前提があるなかで、Linuxそれ自体は、どのように開発されているのでしょうか。 今回、お話を聞いた小崎資広（こさき
LIXIL、現場社員3963人がノーコード開発で1万7007個のアプリケーションを開発 | IT Leaders
IT Leaders トップ ＞ テクノロジー一覧 ＞ 開発ツール／プラットフォーム ＞ 事例ニュース ＞ LIXIL、現場社員3963人がノーコード開発で1万7007個のアプリケーションを開発 開発ツール／プラットフォーム 開発ツール／プラットフォーム記事一覧へ [事例ニュース] LIXIL、現場社員3963人がノーコード開発で1万7007個のアプリケーションを開発 経営陣全員がGoogle AppSheetでアプリケーション開発を経験 2022年6月24日(金)日川 佳三（IT Leaders編集部） リスト 住まいの水まわり製品と建材製品を開発・提供するLIXILは2022年6月24日、Google Cloud Japanが開催した説明会に登壇し、ローコード開発によるアプリケーション開発の民主化の取り組みを説明した同社は、社員みずからGoogle AppSheetを使ってアプリケーシ
CodeIQのブログより。🤔 なぜ、OOPから移行する時なのか Ilya Suzdalnitski OOPは、多くの人にコンピューターサイエンスの重要資産と考えられています。コード構成(code organization)に対する究極のソリューション。すべての問題の終焉。私たちのプログラムを書くための唯一の本当の方法。自分自身をプログラムするという真なる唯一神から私たちに授けられました… それまでは、そうではなく、抽象化の負担、そして無差別に共有されるミュータブルなオブジェクトの複雑なグラフによって、人々は屈し始めています。現実世界の問題を解決するのではなく、「抽象化」と「デザインパターン」について考えるのに貴重な時間と頭脳が費やされています。 非常に著名なソフトウェアエンジニアを含め、多くの人々がオブジェクト指向プログラミングを批判してきました。驚くことに、OOP自身の発明者でさえ、今
【新定番】レスポンシブデザインのブレイクポイントの正解はこれだった[2019最新版] - webのあれこれ
↓↓↓最新の2021年版を作成しましたのでこちらもご覧ください。↓↓↓ hashimotosan.hatenablog.jp PDFはこちらからどうぞ[508KB] 2019年Pixel 3aやGalaxy S10など一通り新機種が発表されたので、2019年改めてブレイクポイントについて考えてみました（3年ぶり！）。 3年経ってほとんどのサイトがレスポンシブデザインになって、ブレイクポイントを少なく効率よく設定していく方向になっているのだと思います 前回、ブレイクポイントの設定はフレイムワークも参考に考えていましたが、 改めて考えてみると、モバイルファーストの観点からも640px/1024pxではないのではないかと感じました。 以下が3年前の前回の記事です。 いくつかブレイクポイントを調べましたが、 だいたい以下のような分け方が多かったです。 640px/1024px 480px/896x
![【新定番】レスポンシブデザインのブレイクポイントの正解はこれだった[2019最新版] - webのあれこれ](https://cdn-ak-scissors.b.st-hatena.com/image/square/c569bf6868b0e2cd70822921c201208292c30537/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fh%2Fhashimotoblog%2F20190528%2F20190528165147.png)
脳に収まるコードの書き方
Mark Seemann 著、吉羽 龍太郎、原田 騎郎 訳、Robert C. Martin まえがき TOPICS 発行年月日 2024年06月 PRINT LENGTH 312 ISBN 978-4-8144-0079-9 原書 Code That Fits in Your Head FORMAT Print PDF EPUB ソフトウェアは複雑さを増すばかりですが、人間の脳は限られた複雑さしか扱えません。ソフトウェアが思い通りに動くようするには、脳に収まり、人間が理解できるコードを書く必要があります。 本書は、拡張を続けても行き詰ることなくコードを書き、複雑さを回避するための実践的な方法を解説します。最初のコードを書き始めるところから機能を追加していくところまでを解説し、効率的で持続可能なペースを保ちながら、横断的な問題への対処やトラブルシューティング、最適化を行なう方法を説明します
テストの学習へようこそ！ コレクションでコンテンツを整理 必要に応じて、コンテンツの保存と分類を行います。 このコースでは、ウェブ用のテストの概要と探索について説明します。 このコースで学習する内容は次のとおりです。 テストの基礎 自動テストと手動テスト テストを実施する場所と方法 ベスト プラクティス 何をテストすべきか、誰に責任があるのか、目的そのものとしてではなく、目的を達成するために手段をテストすることを検討する方法など、テストの理念。 このコースには、学習に役立つ簡潔で実用的なサンプルコードも含まれています。 コースのスコープには、Node.js などの環境で実行される、フロントエンドの JavaScript とドキュメント モデル、バックエンドでのライブラリ テストが含まれます。テストの経験はありませんが、JavaScript の基礎知識と Node.js などに関する経験が必
現在のレスポンシブデザインは、ビューポートにもとづいてレイアウトを最適化しています。しかし、新しいレスポンシブデザインでは、アニメーションが不要なユーザーには動きを少なくしたり（無くしたり）、親コンテナの幅にもとづいてコンポーネントを最適化したり、スコープ付きスタイルやフォームファクターなど、ユーザーの好みや環境に合わせて最適なコンテンツを提供できるようになります。 これらの新しいレスポンシブデザインのコンセプト・実装方法を紹介します。CSSがこれまで以上に進化します。 The new responsive: Web design in a component-driven world by Una Kravets 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 レスポンシブデザインの現状 ユーザーでレスポンシブ コンテナでレス
デバッグが早い人と遅い人の違い
会社にデバッグの早い人と遅い人がいる。 二人を観察していると、色々な違いが見れて勉強になる。 いくつかまとめてみる。 ・デバッグが早い人はコードに着手する前に状況を整理する 期待動作はどのようなものか、現状の動作（バグ）はどんなものか、どんな条件でバグが生じるか、生じないかを整理する 他人からアサインされたタスクの場合、手早くこれらを質問して状況を確認する。 デバッグが遅い人は何も考えずにコードを触り始める。 「何をデバッグしているの？」と聞くと言語化出来ない。 場当たり的、五月雨式に質問する。 ・デバッグが早い人は仮説を持っている。 ざっくりと全体像を把握し、当たりをつけてから作業する。 全ての作業が仮説の検証作業。結果が出た時に次に何をすべきかも把握している。 デバッグが遅い人は自分でも何をやっているか分かっていない。 「よくわからないけど一応2回試してみた」とか言う。 「それは今何を
ノーコードは形を変えた現代のRPGツクールなのではないか
この記事について。 2030 年 「エンジニアです。コードは書けません。」｜__shinji__｜ note 自分はそもそもビジュアルプログラミングやオーサリングに興味があり、ノーコードは興味の範疇でありつつも、現状のもの、現状の「コード抜きで作れる」ような謳い文句は厳しいと思っています。それを、RPG ツクールを例に説明します。 はじめに、ノーコードを分類する 本記事では、「専用の管理画面で編集し、出力のためにコードを書かない、もしくはコピペ程度」のものをノーコードとして扱います。 その中でさらに種類ごとに分類してみます。このような定義があるわけではなく、自分の主観的で暫定的な分類です。 タイプ 1: データベースから自動的にフォームを生成 Google App Sheet MS Power Apps タイプ 2: 高水準 API のパイプライン Zapier IFTTT 古の Yaho
toyokeizai.net satoru-takeuchi.hatenablog.com 全然レイヤーが違うが、自分が何に悩んで、どういう風に理解したか、思い出しながら書き出してみる。 プログラミング歴 20歳からなので、現時点で10年ぐらいだが、中学生の時ちょっと触ったことがあった。 14 歳: 病気で入院したときに暇すぎて、2 週間ほど VBA を触った 大学 1 年: 大学の選択科目で Java, 夏休みに Python と Ubuntu の独習 大学 3 年: Python で自然言語処理のバイト 大学 4 年: Android アプリを作るバイト、就活ポートフォリオとして node/Websocket で MMO 一社目: Unity, ActionScript, Haskell, JavaScript 以降~: JavaScript/CoffeeScript/TypeScri
プログラミング言語のお作法から外れたコードやメンテ性が悪いコードを書くのはダメとよくいわれます。わたしは学生の頃、そういう意見を過剰に気にしていました。コードを書くことそのものに慣れていないのに綺麗に書こうとして手が動かず、動かないがゆえにコーディングの練習が進まない、という悪循環になっていました。そうすると何もアウトプットしないまま知識だけが増えていって、自分がこれくらいできそうというイメージと実際のプログラミング能力とのギャップで苦しみました。 この意識が薄れたのは、あるときものすごく手が早い人のコードを偶然見たときでした。たしかにちゃんと動くものができているんですが、そのコードの中身は当時の私の基準からいって*1おぞましいほど汚いものでした。そこで「これはわたしが書けば100倍くらい綺麗なコードを書けるんでは…」と一瞬思ったんですが、その後すぐに「あ、自分は知識はあるけど練習してない
2021/02/21 10選 => 12選に更新 2021/04/12 おまけを追加 2022/01/04 おまけにThe Modern JavaScript Tutorialを追加 こんにちは、WEBエンジニアのhedrallです。 もう一歩踏み込んでプログラミングに関して勉強をしようと思った時、 世の中には学習のためのレポジトリが存在していて、しかも世界的にはものすごい数のStarを獲得しているものも少なくないことを知りました。 今回はピックアップしてご紹介いたします。 [⭐️ 96.6k]: javascript-algorithms プログラミングで使用されるデータ構造や、一般的なアルゴリズムがまとめられており、全てjsで実装が例示されています。 [⭐️ 149k]: developer-roadmap webやinfraなど各分野のエンジニアになるために知っておくべき技術がロード
バックスラッシュと円記号の歴史と違い
最近知ったんですが、Windowsではキーボードから円記号（¥）の入力はできないらしい。 というのも キーボード右上の¥キー キーボード右下の\キー のどちらかを押せば円記号（¥）を入力できますが、どちらを押しても入力されるのは円記号（¥）に偽装されたバックスラッシュ記号（\ ）らしい。 皆さんこれ知ってました？ いや正直、これを聞いても「何言ってんだコイツ」って思う人が大半だと思いますし、私も今でもそう思います。 これは「バックスラッシュと円記号問題」などと言って、Windowsで昔から続く”呪い”のようなものらしいのですが この”呪い”を理解するには文字コードの歴史を知る必要があります。 文字コードとは？ その前に、そもそも文字コードってなによ？という根本的な話からすると、文字コードは「パソコンに文字を覚えさせるための暗記表」みたいなものです。 パソコンは2進数しか理解できないので あ
.app 1 .dev 1 #11WeeksOfAndroid 13 #11WeeksOfAndroid Android TV 1 #Android11 3 #DevFest16 1 #DevFest17 1 #DevFest18 1 #DevFest19 1 #DevFest20 1 #DevFest21 1 #DevFest22 1 #DevFest23 1 #hack4jp 3 11 weeks of Android 2 A MESSAGE FROM OUR CEO 1 A/B Testing 1 A4A 4 Accelerator 6 Accessibility 1 accuracy 1 Actions on Google 16 Activation Atlas 1 address validation API 1 Addy Osmani 1 ADK 2 AdMob 32 Ads
｢ソフトウェア分野で迅速なイノベーションを実現するには、それぞれが何に取り組んでいるのか、誰が何をコーディングしているのか、把握しておくことが不可欠です｣ 11月21日にツイッターのサンフランシスコ本社で開かれた全社会議の場で、マスク氏は大規模な人員整理が完了したこと、（テスラのような）テキサス州への本拠移転計画は考えていないことを語っているが、上記のメールはその数時間後に送られた。 なお、Insiderがすでに報じたように、同社のフルタイム従業員数は現在約2300人、10月末にマスク氏が経営権を握った時点の7500人に比べて3分の1以下まで激減した。 メールは、エンジニアらに各自報告を求める内容として、｢どんなプロジェクトに取り組んでいるか｣｢何を到達目標としているのか｣の説明に加え、｢その週に書いたコードのサンプルまたはファブリケーター（Phabricator、コードレビュー用ツール）
100万行オーバーのモノリシックRailsアプリをマイクロサービス化したクックパッドの手順 - エンジニアHub｜Webエンジニアのキャリアを考える！
100万行オーバーのモノリシックRailsアプリをマイクロサービス化したクックパッドの手順 マイクロサービスの導入事例を、中の人が徹底的に語ります。クックパッドでは、100万行オーバーの超巨大なRuby on Railsアプリのマイクロサービス化に挑みました。アプリをいかに分離し、連携できるようにするか、など、同社が採ったマイクロサービス化の戦略を聞きました。 Ruby on Railsのバージョンアップに1年かかっていた 【マイクロサービス化戦略】まずはコードを減らすことから 【マイクロサービス化戦略】アプリ固有のバッドノウハウを減らす 【マイクロサービス化戦略】まずは分離しやすい部分からお試しで 【マイクロサービス化戦略】データベースが切れていればサービスも切りやすい 【マイクロサービス化戦略】インフラ構成を標準化する 【マイクロサービス化戦略】サービスメッシュを入れて通信の課題をクリ
「正直９年経ったいまでもfor文ググってる」 という議論記事があった。正直なところ私もググる方の人だ。私の感想: ポンとテキストエディタだけ渡された時に書けるか自信ないぞ...IDEがあればまあ大丈夫かなあ。 JavaScriptだけじゃない。言語色々扱うしという言い訳。正規表現とか毎度調べる。 だから世の中にチートシートというものがあるのだ。お気に入りチートシート多数。 実戦でどうしているか？結局周りのソースを見て馴染む書き方にしていますよ多分。 暗記するかしないかは受験勉強みたいなもので、コーディング面接に受かるなら必要。暗記そのものには意味はないとは思う。 競技プログラミングが使えないとかいう論もあったな。 ググり力も大事。 でも「最低限」もできないのはやはり恥ずかしい気持ちはある。 なんかこれ英語できるできないと似てるな。英語なんてGoogle翻訳、DeepL翻訳あればいいけど、実
システム構成図をテキストで
Gigazineさんでdrawthe.netを取り上げていたので紹介です。使い方はGigazineさんのほうが丁寧なので、気になる方はチェックしてみてください。（2020年12月1日、追記） drawthe.netとは cidrblock/drawthe.netは複雑なネットワーク図も「テキストで書いてブラウザ上でSVGレンダリングできるようにしよう」というコンセプトのもと開発されたツールです。下図のように複雑な構成図も精度高く描くことができます。 拡大してみると情報量が多いこと、またいかに整っているかがわかると思います。 デモサイトも用意されているので、サクッと試したい場合はコチラが便利です。コードはGitHubで公開されています。更新が2017年末で止まってしまっているのが玉に瑕ですが、十分な性能を発揮してくれます。 drawthe.netを使いたい理由 美しい構成図といえばInter
メンタルが弱いエンジニアが安心して開発するために気をつけていること - SMARTCAMP Engineer Blog
スマートキャンプで業務委託でエンジニアをしている佐藤です。BOXILの開発を1年3ヶ月前から、沖縄からフルリモートでやっています。 皆さんは、毎日楽しくお仕事できていますか？ エンジニアという職業は労働時間やストレスが多く、IT業界は他の業界と比べて精神疾患にかかりやすいと言われています。 私はもともと自己否定ばかりしてしまう思考の癖があることに加えて、7年前に起業に失敗してメンタルを壊してしまったことをいまだに引きずっていて、日々悩みながら生活をしています。 スマートキャンプは、過労とは無縁で、メンバー間のサポートもよく、これ以上ないくらい私に合った職場です。それでも自分の心の問題で不安になったり、絶望感に襲われたりすることがあります。今回はそうなるたびに書き綴ったメモを、開発中にネガティブな気持ちにならないための技術としてまとめようと思います。 メンタルが強くないエンジニアはこんな気持
はじめに 「なんか、レビューのたびに変数名を指摘されてる気がする...」 「日本人なんだから、英語で命名とか無理...」 こんなお悩みありませんか？ この記事では、「プログラマーが英語の命名で悩んだ時にどうすれば良いか」をフローチャート形式で解説します！ これであなたも駆け出しエンジニアを卒業できるかも!? ※本記事はLaravel,Vue.jsのプロジェクトで運用されているルールを元に解説しています。 プロジェクト内だけの内輪ルールも含まれていますので、ご了承ください。 対象者 この記事は下記のような人を対象にしています。 駆け出しエンジニア プログラミング初学者 PHP(Laravel),JavaScript(Vue.js)で英語のネーミングに苦戦中 前提知識 下記のような中学・高校で学ぶ内容については理解していること前提で解説します。悪しからず。 三単現のsって何？ 5文型(SV/S
COCOAに関わることになりました
接触確認アプリ「COCOA」について以前ツイートしました。 繰り返しになるけど、COCOAのAndroid版をネイティブで作り直したいので、誰か知ってる人につないで欲しい。 — ARIYAMA Keiji (@keiji_ariyama) February 3, 2021 ツイートした後もGitHubのCOCOAのリポジトリにコメントしたり、知り合いに「COCOAやりたい」「COCOAやりたい」と言い続けたりした結果、このたび厚生労働省の技術参与として正式にCOCOAに携わることになりました。 すること オープンソースコミュニティとの関わりについては、すでに政府CIO補佐官の東さんと関さんが取り組みを始めています。ぼくは二人を手伝いつつ、Issueとして報告があった内容の再現確認をしたり、Pull RequestでExposure Notification APIを使ったテストが必要なとこ
Google の SWE(iOS エンジニア)のポジションに応募してオファーをもらった。 こんなにストレスのかかる日々は久しぶりだった（転職活動ってこんな大変だっけ、と思った）のであとで振り返るためにも文章に残しておくことにした。 これから受ける人の参考になればいいなと思う。 もちろん面接で出た問題の話とかどんなこと聞かれたかとかは書いてない。 TL; DR Google の中途採用を受けてオファーをもらった 受けるまでに5ヶ月準備したことをまとめた 面接を受けてからオファーまで３ヶ月ちょっとかかった 誰？ こんなスペックのソフトウェアエンジニア。 阪大 修士(情報科学) → Sony → LINE 言語 仕事 Windows(C++, C#) 5年 Server(Java, Ruby) 2年 iOS(Swift) 5年 競プロ Python(AtCoder 水色) 英語話者との仕事経験あ
JavaScriptでコードを記述する際、配列の各要素について処理をするケースは頻出します。開発の現場で配列操作の処理を見ていると、次のようなケースがよくあります。 配列の非破壊の望まれる場面が増えているが、元の配列を破壊操作している filter()やevery()など配列のメソッドで書けるところを、forEach()メソッドやfor ... of文を使ってコードを記載し、冗長になっている 記述しても効果のないArray.from()を使用している コード的には問題なく、アプリケーションは意図的に動作しているかもしれません。しかし、冗長な記述は可読性が低下し、予期せぬバグを誘発する可能性があるでしょう。 本記事では、配列操作でよく見かける冗長な記述を、簡潔な記述で置き換える方法について解説します。 本記事で紹介するJavaScriptの配列操作のチートシートを用意したので、まとめて読みた
なぜ脱OSSが増えているのか？
はじめに TerraformやVaultを開発するHashiCorpは自社製品をOSSのMPL(Mozilla Public License v2.0) から、ソースコードは公開するも一部の利用に制限があるBSL(Business Source License) への変更をアナウンスしました。 これは2018年のRedisを皮切りにMongoDBやCockroachDB、ElasticSearchなど多くのプロダクトで進められている脱OSSの流れです。商用のオープンソース[1]と言われてしまうこともある最近のこの動きの理由は何故なのか？ という点を以下の動画で解説しました。 動画中では尺の都合で端折った個所も多いので、こちらの記事の方にもまとめておきたいと思います。 OSSとは？ OSSの定義 まず、OSS（オープンソース）とはなんでしょうか？ これはRMSのフリーソフトウェアを源流とする
どんな人向けの記事？ レビューによって心理的なダメージを受けやすい方 非エンジニアだが、エンジニアチームがどんな機能を作っているか知りたい方 業務が溜まっていて、レビューに割く時間を捻出するのに苦労している方 コピペできるコードも公開します 初回レビューをAIに任せると、いろんなロールの人の役に立つ レビューは得意ですか？ 優秀なエンジニアしかいないチームであれば、PRは1トピックに絞って小さく明確なコミットによって作成され、適切な要約とともに提供されることでしょう。 しかし、実際にはいろいろな制約から、PRが想定よりずっと大きくなってしまったり、関連トピックと異なるコードが混じってしまうこともあります。 実際のところ、大きなPRを適切にレビューするのは難しいことです。また、自分が詳しくない領域のレビューを行わなければいけない機会もあります。 今回の記事は、レビューを作成してくれるAI C
Web制作者必見！ VS Codeのおすすめ機能拡張のまとめ、HTMLやCSSやJavaScriptのコードを書く時に便利
Visual Studio Code（以下、VS Code）が素晴らしいエディタである理由の一つは、デベロッパーの生産性を向上させるVS Codeの機能拡張の巨大なライブラリがあることです。 その中から、HTMLやCSSやJavaScriptのコードを書く時に便利なVS Codeの機能拡張を紹介します。 My 12 Favorite VSCode Extensions by Katherine Peterson 下記は各ポイントを意訳したものです。 ※当ブログでの翻訳記事は、元サイト様にライセンスを得て翻訳しています。 VS Codeとは VS Codeの機能拡張 VS Codeのおすすめ機能拡張 VS Codeとは VS Code(Visual Studio Code)は、Microsoftが提供する統合ツールを備えた強力で軽量なコードエディタです。MITライセンスで、商用でも完全に無料
大幅にリニューアルされた Next.js のチュートリアルをどこよりも早く全編和訳しました - Qiita
数日前（4/21頃）に Next.js のチュートリアルが一新されました。 Next.js は 3 月頭に ver 9.3 がリリースされ、ビルド時に静的に HTML を生成する関数などが追加されるなど、今までよりもかなりパワフルになり、いわゆる JAMstack と呼ばれるようなアプリケーションを作りやすくなりました。 そのバージョンアップに対応するかたちで、チュートリアルも大幅に書き直されました。 参考（開発チームの @chibicode さんのツイッター） Next.jsの公式チュートリアルを最新版に沿ってゼロから書き直しました! 🎓英語ですが初心者向けです! ⚛️最近導入されたgetStaticProps等の関数や、 🎨CSS Modulesの解説をしています! 🗣ブログを作りながら学びます 🤗ご感想お待ちしております!https://t.co/R4j9vpAQoc — S
設計を歪める認知バイアス - Qiita
こんにちは、リファクタリングが大好きなミノ駆動です。 この記事は READYFORアドベントカレンダー2021 、5日目の記事です。 これはなに？ ソフトウェア開発において、設計をないがしろにすると、低凝集密結合な構造に陥り、変更容易性が低下してしまいます。 設計スキルを高め、あるべき構造を設計する……これで解決できるに越したことはありません。 しかし、認知バイアスと呼ばれる心理効果により判断を誤り、良くない設計をしてしまうことが往々にしてあります。 本記事は、設計を歪めてしまう認知バイアスを理解し、設計判断の精度向上を促すことを目的とします。 この記事のゴール 人間の判断を歪めてしまう心理効果「認知バイアス」の存在を知ること。 ソフトウェア設計も、認知バイアスの悪影響を受けてしまうこと。 認知バイアスに振り回されない設計アプローチを身につけること。 認知バイアスとは 先入観や思い込み、偏
絵文字を支える技術について｜nona
はじめにこちらはmhidakaが建立したAdvent Calendar Day.3となります。 こんにちは、はじめまして、のなと申します。mhidakaさんのTweetを見つけて、初めてAdvent Calendarなるものを書いています。なにかお作法間違っていたら大目に見てください、よろしくお願いします。 軽く自己紹介をさせていただくと、普段はGoogleでAndroidのTextまわりの開発を行っており、DroidKaigiやShibuya APKで発表させていただいたりしています。最近はほぼ絵文字の話しかしてないので、絵文字おじさんと思われてそうですが、普段の仕事は絵文字に限らず、Androidの文字表示の部分は大抵面倒をみています。 今回この機会をいただいたので、どんな内容を書こうか迷ったのですが、やはり皆が読んで面白い内容というと、絵文字になるのかなぁ、ということで性懲りもなく絵
AppleやNike、Teslaといった誰もが知る大企業のWebレイアウトを、CSSで再現するテクニック集がTwitterで投稿され、話題となっています。 CSSのみで表現できる目からウロコのテクニックが中心で、あの驚くようなエフェクトも実はシンプルな数行のコードで表現されていたりします。 コピペできるCSSコードと一緒に、デモサンプルも確認してみましょう。CSSで解決できるテクニック、増えています。 「これどうやる？」アップルやナイキなど大企業Webサイトで利用中のレイアウト再現CSSテクニック集 ノーコードでレスポンシブなデザインを構築できる Builder.io のCEO @Steve8708は、有名サイトで使われている魅力的なレイアウトが、どのように作成されているのか、コピー用のサンプルコードと一緒にみじかい動画で詳しく紹介しています。 ユーザーの視線を奪うアニメーションやレイアウ
こんにちは丸山@h13i32maruです。つい先日、devchat.fmというポッドキャストに出演して、「ドキュメント」というお題について話しました。なぜこんなニッチなお題について話したかというと、Ubie Discoveryに入社して5ヶ月の間にいくつか*1まとまったソフトウェアドキュメントを書いたので、自分の中でホットな話題だったからです。 #devchatfm 33回目は、Ubie DiscoveryのSWE @h13i32maru にドキュメントを書くことで得られるメリットや、ポイント・工夫などを聞きました！ #33 チームの生産性を上げるドキュメントのすすめ with@h13i32maruhttps://t.co/TrmZd13D91— 久保 恒太 / Ubie CEO (@quvo_ubie) 2021年8月12日 これらのドキュメントは個人的にわりと良く書けたと思ってますし、
ソフトウェア設計について、YAGNIやSOLIDなど多くの原則・法則があることが知られていますが、その解釈にはぶれが存在することが多いです。そこで、特に有名なものあるいは有用と感じることが多いものをいくつかピックアップして、その解釈やトレードオフについてまとめてみました。 注意としては、SOLIDが入ってることからわかる通り、主にOOPに関する文脈になります。また、各原則の定義については概ね知っている前提で書いているのであまり初学者向けの記事ではないかもしれませんのでご承知おきください。 YAGNI（You ain't gonna need it.） YAGNIは、予測による実装が実際に役立つことは少ないという経験則から生まれた原則です。 一般にオーバーエンジニアリングが利益をもたらすケースは限定的で、どちらかというとプロジェクトに害を与えることが多いとされています。YAGNIは日々状況の
［速報］「Amazon CodeGuru」発表。機械学習したコンピュータが自動でコードレビュー、問題あるコードや実行の遅い部分などを指摘。AWS re:Invent 2019
Amazon Web Services（AWS）は、米ラスベガスで開催中の年次イベント「AWS re:Invent 2019」の基調講演で、機械学習を用いて自動的にコンピュータがコードレビューをしてくれる「Amazon CodeGuru」を発表しました。 Amazon CodeGuruのコードレビュー機能は、Amazon自身のこれまでの大量のコードと、GitHubで公開されているポピュラーな1万のオープンソースソフトウェアのコードを基に機械学習のトレーニングを行ったモデルを用いて、対象となるコードを解析。 GitHubやCodeCommitのプルリクエストと連係し、問題があるとされた個所には人間に読める形式でコメントをしてくれるというもの。 並列処理や脆弱性の問題あるコードを指摘 例えばAWSにおけるベストプラクティスのコードから外れているものや、並列処理における問題などの指摘。
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Web制作の現場で使えるWebサービス13選！無料で使えるサービスを集めてみた | BUILD Journal
『Qiitaユーザーが選ぶ、2019年に読んで良かった技術書』アンケート結果発表 - Qiita Zine
コードリーディングのコツは極力コードを読まないこと｜牛尾 剛
グラデーションの中央がグレーに濁ってしまう仕組みをくわしく解説、美しいグラデーションをCSSで実装する方法
オブジェクト指向プログラミング -- 1兆ドル規模の大失敗
テストの学習へようこそ！ | web.dev
CSSの進化がすごすぎる！新しいレスポンシブデザインの実装方法を解説
プログラミングを学ぶにあたって詰まったことと、そこから学んだこと - mizchi's blog
ヘタクソなコードを書いてもいい - 覚書
Webエンジニアが勉強できるGit Repository 10選 - Qiita
コードの健全性: 礼儀正しいレビュー == 役立つレビュー
イーロン・マスク、エンジニア全員に｢週報｣提出を義務化。1週間で書いたコードの明細まで
「正直９年経ったいまでもfor文ググってる」 - Qiita
初心者プログラマーのための変数/関数/メソッドの英語命名規則 - Qiita
Google の中途採用を受けてオファーをもらった話
配列を征する者はJSを制す。JavaScriptのスマートな配列操作テクニック - ICS MEDIA
もう初回コードレビューはAIに任せる時代になった - CodeRabbit -
【CSS】「これどうやる？」アップルやテスラのWebレイアウト再現テクニック集
ソフトウェアドキュメント作法 - maru source
ソフトウェア設計についての原則や法則についてまとめてみた