はじめに 普段、Ruby On RailsでMPA（マルチページアプリケーション）による開発をメインに行っています。 最近「jQueryを使わない」という話しをチラホラ見かけるようになりました。その辺を調べていくうちに自分も「jQueryを使うのやめよう」と思いました。しかし、jQueryに慣れてしまっていて、プレーンなJSで書く方法がパッと出てこなかったので、その辺りを備忘録としてまとめてみました。 jQueryでよく使っていた機能 自社内のプロダクトでjQueryの利用状況をざっと見たところ、利用されている機能としては次のものが多かったです。 セレクタ Ajax イベント ループ それぞれプレーンJSでの記述例を書いておきます。 単一セレクタの例 jQuery
lizod: 1kb 未満の zod の精神的後継
作った。 lightweight-zod だから lizod。 npm install lizod -S で使える。 tl;dr 各種フロントエンドや Cloudflare Workers で zod のビルドサイズが邪魔になっている メソッドチェーンと便利なユーティリティを全部捨てた zod 風のバリデータを作った zod の 57kb に対して lizod は 1kb 以下 これが動く // Pick validators for treeshake import { $any, $array, $boolean, $const, $enum, $intersection, $null, $number, $object, $opt, $regexp, $string, $symbol, $undefined, $union, $void, type Infer, type Valid
何がjQueryを負債たらしめているのかを考察する | yamanoku Advent Calendar 2023
何がjQueryを負債たらしめているのかを考察する この記事はyamanoku Advent Calendar 2023の12日目の記事になります。 現代のフロントエンド技術的負債の要因となっているものはいくつかあると思いますが、その中でも共通で「jQuery」が挙げられるかなと思っています。長期間運営されているサービスであればまだまだ現役なのではないでしょうか？かくいうウチもそうです！ 2023年現在でのフロントエンド開発であれば今は新規でjQueryを選択肢としてあげることはほとんどないと思っていますが、今よりもJavaScriptのサポートが貧弱だったころ、かつてのブラウザ間の齟齬を吸収する点で大変重宝されていたようです。 JavaScript自体が進化してきたのもあり、jQueryでできた表現が単体のJavaScriptとWeb APIとで表現できるようになってきている1ので
はじめに こんにちは、レストランボード（以下、RB）のフロントエンドチームの石亀です。担当していた規模の大きめなプロジェクトでVueを結構触っていまして、設計含め困難と向き合いながら色々取り組ませてもらったのでそれをナレッジとして残そうと思い記事を書くことになりました。エモいですね。 RBは現在自社のフレームワークで構築されていて、徐々にVueでリプレイスをかけています。 今回、大規模なプロジェクトにてVueでさらなるリプレイスを実行しましたが、プロダクト自体がとても大きく且つ限られたリソースの中でいかに負債化させずにできるだけ安全に移行させるかを検討しました。 そこで実際に実施した施策や検討内容などを紹介します。 おそらく、多くのサービスやプロダクトで既存のコードを新しいライブラリ・フレームワークで書き換えているかと思います。 背景だったり関わる規模・コンテキストが異なるとは思いますが、
ほぼ独学・未経験者がモダンな技術でポートフォリオを作ってみた【Rails / Nuxt.js / Docker / AWS / Terraform / CircleCI】 - Qiita
ほぼ独学・未経験者がモダンな技術でポートフォリオを作ってみた【Rails / Nuxt.js / Docker / AWS / Terraform / CircleCI】RailsAWSCircleCITerraformNuxt はじめに こんにちは! akiと申します！ 当記事はほぼ独学・未経験者がモダンな技術でポートフォリオ（以下PF）を作ってみたので、ご紹介させて頂きたいと思います。 昨今、未経験者がモダンな技術を使用して作成した、PFの作成記事も多く存在するので、何番煎じかにはなってしまいますが、この記事も同じ初学者の方の参考になれば幸いです。 自己紹介 私は22歳・高卒で、現在(2021年3月時点）も工場で製造の仕事を続けております。 そんな私ですが「Webエンジニア」という職種に興味を持ち、2020年4月よりプログラミング学習を開始しました。 今回紹介するPFの作成期間は約3ヶ
昨今のフロントエンドトレンドを鑑みてフロントエンドの技術構成を考えると今はどんな選択肢が主流でしょう？ それぞれ並列なものではないですが、React? Vue? Next? Nuxt?そんなワードがきっと頭に浮かぶでしょう。 今の時代、jQueryでゴリゴリUIを記述するとなんだか白い目でみられる。 そう、令和とはそういう時代です。 界隈の最先端おじさんをみると、build processがあるのは当然で、HTML/CSSはjsが吐き出すもので、それが最大限正しいように語られています。 確かにExising Domのアプローチで界隈から評価されてるライブラリはなく、さほどいい選択肢には見えません。(個人の主観) ではそれらのアプローチの何がそんなにいいんでしょう？ 過去から現在まで我々は何に苦心して、それらはそれをどう解決してくれたのでしょう？ 雑に紐解いていきましょう。(今回はUI構築の
Chatwork のプロダクトフェーズと技術選定の流れ - Chatwork Creator's Note
こんにちは！ Chatwork 株式会社のプロダクトマネージャー (PM)、宮下 (@ryugoo_) です。 2013 年にモバイルアプリエンジニアとして入社し、 2014 年に Android 専任になり、 2019 年からは PM に転向してそろそろ 2 年になろうとしています。 さて、今回はエンジニアから PM になった私から見た、 Chatwork の技術選定の流れの変化について話してみようと思います。 技術選定の歴史 2013 年 - PMF を目指すために 2014 〜 2016 年 - 技術的課題を解決するために 2017 〜 2020 年 - ユーザー影響を最小化するために これから - 攻めた技術選定を、ユーザーのために 2013 年 - PMF を目指すために 2013 年当時の Chatwork は PMF (Product Market Fit) を目指すフェーズ
10年越しの Web フロントエンドという職種界隈についての考 | Offers Tech Blog
Offers を運営している株式会社 overflow の あほむ でございます。 10年越しのWebフロントエンド 最近更新していない 自分のブログ を遡ると「フロントエンド」という語の初出は 2010 年であり、転職のタイミングで自らを「Web フロントエンドエンジニア」と定義したのは 2012 年の頃でした。 それから 10 年、自分語りとして記憶をたぐることの老害仕草たるやですが、今回はそのノリのまま表題の通り Web フロントエンドという職種界隈についての考えを述べてみます。 Webフロントエンドとは一体... 先日、TechFeed Experts Night#4 〜 フロントエンドアーキテクチャを語る でお話しする機会をいただいたので改めて自分の中の Web フロントエンドを言語化してみました。 イベント資料 より抜粋 いくら抽象化しても原則としては全てが HTML で表現さ
※この記事は、2022 Speee Advent Calendar11日目の記事です。 昨日の記事はこちら tech.speee.jp こんにちは、DX事業本部エンジニアのさとーる（@satotoru2000）です。 私は今年の6月から「イエウール」というプロダクトのSEOコンテンツ開発チームで開発をしています。今回はその中でやったことをまとめながら、 モノリシックRailsアプリの一部のドメイン領域を担当する状況下で、自信をもって変更できる領域をどうやって広げたか？ という話をしようと思います。 当初のイエウールの課題 イエウールは、アーキテクチャ的にはいわゆる一般的なモノリシックRailsアプリです。下の図のように、一つのRailsアプリケーションにほぼ全ての必要な機能が乗っているような状態です。 イエウールcoreに乗っているものたち また、サービスとしてもそれなりに歴史があるプロダ
JSのプラグインシステムについて書くJavaScript Plugin Architecture 2.0をリリースしました JavaScriptのプラグインシステムについて書いた小さな電子書籍であるJavaScript Plugin Architecture 2.0をリリースしました。 1.0(初版)公開時の記事は次のページから参照できます。 JavaScript Plugin Architectureというプラグイン設計について学ぶ無料の電子書籍を書いた | Web Scratch 2.0の詳しい変更点についてはリリースノートを参照してください。 Release v2.0.0 · azu/JavaScript-Plugin-Architecture 2.0リリース時にGitBookからHonKitに移行しました。 そのため、公開するURLが次の場所に変更されています。 https://a
こんにちは、QUATRE（キャトル）です。 はてなブログをはじめて１年になりました。 自分で自分にオメデトウ〜 と言いたいところですが、反省すべきところが山積みです。 私のブログは、テーマをひとつに絞っていないので、記事をカテゴリーで分類していますが、ブログ投稿記事も150近くになってくると、カテゴリーが増えすぎて収拾がつかなくなってきました。 ある日、私のブログを見て夫氏が苦笑。 「カテゴリーがすごいことになってる。。。」 いつかどうにかしなければと思いながら放置していました。その時の気分で適当につけたりつけなかったりなので、痛いところを突かれたな、と反省です。 そこで、今回は、カテゴリーに取りかかりました。設定方法をまとめてみたので、ぜひご参考くださいね。 はてなブログカテゴリー表示の階層化 はてなブログには、カテゴリーを階層化する機能がありません。 カテゴリーを階層化するブログパーツ
メドピアCTO室フロントエンドエンジニアの小宮山です、よろしくおねがいします。 趣味はボルダリングとヨガとピラティスです、よろしくおねがいします。 ６月某日、長野県松本市の地にて開催されたメドピア開発合宿で取り組んだことについて紹介していきたいと思います。 アンパサンドへのウラミツラミ タイトルにも挙げたとおり、今回立ち向かったのはSass/SCSSのアンパサンド（&）です。 メドピアのリポジトリはほぼSCSSで統一されているので、この記事ではSCSSの記法ベースでコード例を載せていきます。 アンパサンド記法は、BEMライクなセレクタを書くときによく利用されるのではと思います。 例えばこのようなものです。 .header { &__foo { color: green; } &--bar { color: blue; } } アンパサンドを使い、冗長な記述を限りなく減らしたスマートな書き方
ここでいうおじさんSEとは、主にSIerに生息する、 ・30歳以上で ・モダンな技術を知らない ・レガシーな技術しか知らない ・主に設計書などのドキュメント類を弄っており、コーディングをしない ・現状から変わる気がない（キャリアアップに対し具体的なアクションがない） 人たちを指す。 決して単に妙齢のエンジニアを一括りにしているわけではない。 「おじさんSE」より良い呼び方があれば、ぜひご提案いただきたい。 第1章 おじさんSEの仕事内容 おじさんSEは、コードを書くことはほぼ無い。 これは現場にもよるので、全く無いというわけではないが、 多くのおじさんSEはコーディングはしない。 ではおじさんSEは何をやっているのかというと、 ・内部設計書、外部設計書、詳細設計書の記述 ・結合試験以降の試験項目票の作成 ・試験結果のレビュー 大抵はこの3つになる。 99.9％はウォーターフォール型である。
もう年末ですね。 去年の今頃は風邪で鼻水だらだらの記憶がありますが、皆さんは如何お過ごしですか？ どうも、しばおです。 さて、いきなりですが、皆さん ハンバーガーボタン ってどうやって作ってます？ ハンバーガーボタン の作り方をググったりすると、空っぽの span タグ 3個で作ってたり、div タグ や チェックボックスで作ってたりするのをよく見かけます。 でもね。僕的には、button 要素がベストだと思っているんです。 そこで今回は、なぜハンバーガーボタンを button 要素で作った方がいいのかや、僕なりの作り方をできる限り詳しく解説をしてみたいと思います。 ちなみにこの記事は、ある程度、HTMLやCSS、JavaScriptを使った基本的なコーディングを理解している人向けになりますので、CSSって何？って方は先に、基本的なコーディングを学習しておいて下さい。 ハンバーガーボタン
タウンワークはオープンから10年以上が経過しており、JavaScript、CSS、HTMLを含め、フロントエンドの老朽化が課題となっているのは連載の第1回でお伝えした通りです。過去のA/Bテストの名残や、暫定対応と思われるコードが継ぎ足された結果、似たようなコードが残っていることも多く、フロントエンドのエンハンスの際に手戻りを多く誘発することが問題視されていました。本稿ではこうした問題に対し、この1年で取り組んできた改善内容を紹介します。派手な内容はないですが、レガシーコードに現実的に対峙し改善していく際の参考にしていただければと思います。 連載第1回：10年以上稼働し続ける大規模Webアプリケーション、どうやって改善する？ はじめに こんにちは。リクルートテクノロジーズでソフトウェアエンジニアとグループマネジャーをしている高橋陽太郎です。連載第3回の本稿では、タウンワークにおけるレガシー
jQuery、今までありがとう【移行すべき理由と代替案3選】
世界で一番初心者に優しいWeb制作のメディア。HTML/CSS/JavaScript、WordPress、Web制作の考え方を解説します。
初めまして 60歳を間近にウェブデザイナーを目指して独学で勉強しているお婆ちゃんです。 去年の暮れからphpを勉強して、初めてシステムらしきものを作ってみました。 やりたいこと プチ・クラウドストレージ ・ファイルをどこからでもアップ、保管してダウンロードもできる。 ・セキュリティも兼ねてIDとパスワードでログイン形式にする。 まずはパワーポイントでサイトの系図を設計しました。 Excel、Word、パワポは商工会議所で習いたてホヤホヤです。 それぞれ基礎編までクリアして1月半くらいかかりました。 全部で5万円くらいはかかったかな。 次は手順を考えてイメージを具体化。 これは無料版のAdobeのXDを使ってみました。 操作も簡単で、感覚的に作れちゃうので便利です。 ページ自体はシンプルにしたかったのでフォントだけで作りました。 コードを書くのもAdobeの無料Brackets。Adobeド
Published: August 4, 2023 Updated: October 27, 2023 Part 1: an intro about music, defaults, and bubbles Like a lot of people, there was a time when the only music I listened to was whatever was played on my local radio station. (A lot of people over 30 or so, anyway. If this doesn’t sound familiar to you yet, just stick with me for a minute here.) At the time, I was happy with that. It seemed like
成熟したRailsアプリのフロントエンドを最新にリニューアルする方法（翻訳）｜TechRacho by BPS株式会社
概要 原著者の許諾を得て翻訳・公開いたします。 英語記事: Keep up with the Tines: Rails frontend revamp — Martian Chronicles, Evil Martians’ team blog 原文公開日: 2020/06/03 著者: Rita Klubochkina、Andy Barnov サイト: Evil Martians -- ニューヨークやロシアを中心に拠点を構えるRuby on Rails開発会社です。良質のブログ記事を多数公開し、多くのgemのスポンサーでもあります。 日本語タイトルは内容に即したものにしました。 アセットパイプラインで提供される既存のjQueryやCoffeeScriptのフロントエンドを一切損なわずに、「React」「MobX」「GraphQL」「Tailwind CSS」「Webpacker」の複雑な
こんにちは。よわよわRailsエンジニア愛知代表のshitaです。 最近フィヨルドさんやmofmofさんのミートアップで、駆け出しエンジニアの方達に就職の相談をいただくことがありました。 自分は未だによわよわなのですが、駆け出しエンジニアの頃は今よりもっとよわよわでした。その時にRails友達と話していた悩みを思い出したのでここで共有させてください。 よわよわRailsエンジニアのジレンマ よわよわRailsエンジニアはよわよわな現場にしか入れず技術力が上がらないので、ずっとよわよわな現場から脱出できない。 つよつよな現場はつよつよRailsエンジニアを求めるため、よわよわRailsエンジニアはよわよわな現場に入るしかない しかしよわよわな現場では技術力を上げるのが難しい 技術力が上がらないので、よわよわエンジニアはつよつよな現場に入ることができず、ずっとよわよわな現場から脱出できない そ
This article explores a phishing technique that simulates a browser window within the browser to spoof a legitimate domain. Introduction For security professionals, the URL is usually the most trusted aspect of a domain. Yes there’s attacks like IDN Homograph and DNS Hijacking that may degrade the reliability of URLs but not to an extent that makes URLs unreliable. All of this eventually lead me t
SmartHR、LayerX のアーキテクチャをそれぞれ話す「マイクロサービス？モノリス？2 社のアーキテクチャから見るPros/Cons」。ここで株式会社SmartHRのすがわら氏が登壇。「SmartHR」における3つの「大きくてつらい」問題と、その解決に向けた社内の取り組みを紹介します。 自己紹介 すがわらまさのり氏：本日はSaaSのアーキテクチャについて、私の所属企業であるSmartHRの事例を紹介していければと思います。「SmartHR」は人事労務に関する処理をペーパーレス化できたり、人事データの一括・一元管理を行えるサービスを提供するSaaSです。 はじめに、簡単な自己紹介をさせてください。私はすがわらと言います。SmartHRに2年くらい在籍しています。職種はプロダクトエンジニアで、いわゆる開発をするエンジニアです。2021年の7月からチーフという役割をもらっていて、チームのマ
この記事は食べログアドベントカレンダー2020の1日目の記事です。 2020年も残り1ヶ月になりました。早いものですね。 この記事を執筆するのは、食べログでフロントエンドチームに所属する@hagevvashiです。 はじめに食べログではRuby on Rails(以下RoR)を用いており、サイトの大部分がRoRによってHTMLのレンダリングまで行われています。JavaScriptでの実装はほとんどがjQueryなどを用いた非宣言的なものとなっています。 歴史あるサービスなので、それなりにコード量が増えかつ複雑になっています。例えば既存のjQueryやBackbone.jsで書かれたソースコードを変更するのに予想外のコストを強いられたりします。 食べログを引き続きユーザにとって価値のあるサービスにするためには、いち早く新しい機能を届ける必要があります。そして、そういった予想外のコストを少しで
GitHub - sachinchoolur/replace-jquery: Automatically finds jQuery methods from existing projects and generates vanilla js alternatives.
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
JavaScript, the undisputed king of web development, is being sabotaged — not by a rival language or a revolutionary new technology, but by its own baggage from the past. This insidious saboteur is none other than CommonJS, the antique module system that we’ve tolerated for far too long. The rise of CommonJSAbout 15 years after its invention, JavaScript started expanding beyond the browser to the s
こんにちは。WEAR Webフロントエンドチームの冨川 (@ssssota) です。 私たちのチームでは普段WEARのWebフロントエンド全般の開発から運用までを行なっています。また、あと半年ほどで10年になるVBScript+jQuery環境からNext.js/React環境へのリプレイスを進めています。 リプレイスの詳細は弊チームの藤井が書いた記事をご覧ください。 techblog.zozo.com 本記事では、WEARのWebリプレイス環境における自動テストの構成について紹介します。自動テストの構成を悩んでいる方の決断の一助になれば幸いです。 はじめに 前提 構成の決定と判断 QAチームによるE2Eテスト Playwrightによるビジュアルリグレッションテスト Vitestによる小さなテスト その他検討したテスト おわりに はじめに 先に結論を述べますが、WEARのWebフロントエ
最近見つけたおもしろ自作言語の紹介 - Qiita
GoやTypeScriptなど、大企業がつよつよマンパワーで作ってるプログラミング言語が日の目を当たる一方で、個人が盆栽を愛でるがごとくひっそりコツコツと作っているプログラミング言語もあります。ここではGitHubのprogramming-languageトピックで見つけた自作言語の処理系から、スター数が少なくユニークな言語仕様を持った言語処理系をいくつか紹介します。 ちなみに、programming-languageトピック検索はこのようなAdvent Calendarを見る人にとって宝の山なので定期的に見ておくと幸せになれます。ただ、誰でも知ってるようなメジャー言語処理系が邪魔なので、スター数などで制限をかけておくと良いかと思います。 私は普段スター数50未満のprogramming-languageトピックが付いているリポジトリをRecently updatedで検索しています。 h
ケンモFMの配信バックエンド :: ラジオ番組の制作からライブ配信、Podcast化までを全自動化 - Qiita
ケンモFMとは 5ちゃんねる嫌儲板で、コロナ感染者を適当に予測したスレが立ち、明確なソースが貼られないまま「ソースはラジオで聴いた」などの一文が添えられていました。それを揶揄し、「ケンモFMかよ」のようなレスが付いたのが元ネタです。 せっかくなので、fmドメインを取得した上で、スレタイ（スレッドのタイトルのことです）を自動で読み上げるサイトを作ったのが https://kenmo.fm です。YouTubeにも同時配信しており、 https://www.youtube.com/channel/UCHBucrED96_pdOCvIs6jNSQ/live で聴けます。 とりあえずサイトにて自動で生成される音声を聴いてみてください。 システム構成 現状はこのようになっています。 ほぼTypeScriptで書かれており、所々にBashも使用しています。 順に解説します。 1 スクレイピング この項
WebサイトのUIにフローティング要素、ドロップダウン、ツールチップ、ポップオーバー、ナビゲーションなどを実装するJavaScriptのライブラリを紹介します。 フローティング要素の実装で問題となる配置の向きや衝突やオーバーフローなどにも対応しており、アクセシブルなフローティング要素を実装できます。 Floating UI Floating UI -GitHub Floating UIの特徴 Floating UIのデモ Floating UIの使い方 Floating UIの特徴 Floating UIは、ドロップダウン、ツールチップ、ポップオーバー、ナビゲーションなどのフローティング要素を配置するためのJavaScriptライブラリです。 フローティング要素はコンテンツのフローを中断することなくUIの上に浮かぶため、配置するときに課題が発生します。Floating UIではフローティン
⛰ はじめに こんにちは。Owners Marketing所属の 若菜 です。 今回は、普段サーバーサイドエンジニアとしてプロダクト開発に従事している私が、BASEのフロントエンド開発に携わった経験をお話しさせていただきます。 結論、 付加価値がいくつもあった非常に良い経験であった と言えます。 BASEでの働き方や開発組織の雰囲気を少しでも伝えることができましたら幸いです！ 🙋♂️そもそもなぜフロントエンド領域を担当することになったのか 私の所属するOwners Marketingでは、新規ショップオーナーの方によりよくBASEを使ってもらえるための機能改善や、 もっとたくさんの人にBASEを使ってもらえるようにするための機能提供に取り組んでいます。 先日、「オーナーズコミュニティ BASE Street へSSOログインできるようにする」というリリースを行いました。 BASE St
ushironoko.me Vue.jsビギナーズガイド などを著書に持つushironokoさんの記事。 とくに共感したのは以下の文章 Vue は長らく「持たざる者のための宣言的UI」でした。React は Javacript さえ書ければ使えると評されるように、裏を返せば JavaScript を書けないデザイナーや非フロントエンドエンジニアにとって扱いが難しく、jQueryが支配的な環境において Vue の存在はとてもありがたかったのです。 https://ushironoko.me/articles/2022/vue-ore-taido 僕がVueを知ったのは「Angularほど難しくない軽量データバインディング」としてのVueだったのでニーズが重なっていた。逆にこのニーズは今後Vueではなく別のライブラリが補うことになるのかもしれない。 TypeScript対応もComposit
Bootstrap 5 alphaがついにリリース！注目すべき新機能、jQueryは削除、IEすべてのバージョンのサポート終了
先日の記事で春後半の夏前にリリースされるとお伝えした通り、Bootstrap 5のalpha版がついにリリースされました！ IEすべてのバージョンのサポート終了、jQueryの削除をはじめ、注目すべき新機能を紹介します。 Bootstrap v5 Bootstrap v5の特徴 Bootstrap v5のダウンロード・インストール Bootstrap v5のグリッドやコンポーネント Bootstrap v5の特徴 最も注目すべき点は、jQueryへの依存がなくなり、Internet Explorerのサポートも終了したことです。ちなみに、Bootstrap 4.5ではIE10/11をサポートしています（v4.5 Supported browsers）。より高速なJavaScript、より少ない依存関係となり、よりフレンドリーなツールを構築することに重点が置かれています。 また、現時点ではア
［速習］ Puppeteer ～ヘッドレスChromeでテスト＆スクレイピング 第2章ブラウザ操作自動化の基本 ～非同期処理を扱うasync/await関数、自動化の鍵を握るPuppeteerコンポーネント 第2章では、実際にヘッドレスChromeを自動化するうえで必要となる、最新のJavaScriptの構文やPuppeteerのAPIについて解説します。 進化し続けるJavaScript PuppeteerのAPIを解説する前に、第1章の冒頭で掲載したサンプルコードを見返してみましょう。もしかすると、中にはまったく見慣れない構文が見つかったかもしれません。 const puppeteer = require('puppeteer'); (async () => { const browser = await puppeteer.launch(); const page = await b
第一部 JavaScript、その起源 1995年 NetScape社のブレダン・アイク氏が開発 ポケモン赤・緑とタメ 最初はLiveScriptって名前だった 「Javaっていう言語が超ナウいらしいぞ」 1995年にJavaによるブラウザWebRunnerが、HotJavaという名で世界に公開 NetscapeがJavaのサポートを表明 今、Javaが熱い!! 「せや!名前もらったろ!」 改名 LiveScript -> JavaScript 第二部 スクリプト戦国時代 ライセンスの乱 1996年 MicrosoftがIE3.0を発表「JavaScript使わせてやー」 NetScape社「だが断る」 Microsoft「ほな勝手に作るわ」 => JScript誕生 各ブラウザベンダが独自言語を実装する戦国時代へ Webエンジニアは血の涙を流す 想像図 「JavaScriptってどうよ?
Hi, I'm Sam — software engineer at Spot and the 2nd most active maintainer of Emotion, a widely-popular CSS-in-JS library for React. This post will delve into what originally attracted me to CSS-in-JS, and why I (along with the rest of the Spot team) have decided to shift away from it. We'll start with an overview of CSS-in-JS and give an overview of its pros & cons. Then, we'll do a deep dive int
はてブ考
はてなブックマークがユーザーインタビューをするということで、はてブに対する思いをネットに発露している人達が散見された。 【追記：応募期限5/20まで】はてなブックマークのユーザーインタビューにご協力いただける方を募集します - はてなブックマーク開発ブログ この度はてなブックマーク開発チームでは、サービスをご利用中のみなさまを対象に1時間程度のオンラインインタビューにご協力いただける方を募集します。 ご協力いただける場合は、以下概要をご覧の上、この記事の末尾にある応募フォームからご応募ください。 bookmark.hatenastaff.com 自分はコロナ禍になって気がつくとはてなブックマークばかり見ていてヘビーユーザーになっていた（ブックマークはあまりしてなくて見る専）。会社の人との雑談がなくなり、息抜きしたいときにははてブを見る暮らしをしている。 なのでインタビューに応募してみたのだ
【注意喚起】第三者のQiitaのコピー記事で飯を食っているかもしれないサイトについて... - Qiita
見つけた タイトルをそのままGoogleで検索したら同じ記事が出てきました。 Qiitaの色んな方の記事タイトルをGoogleで検索したら全く同じタイトルの記事がやや高確率で検索上位に出てきました。 私は怪しいと思ったので、軽く調べることにしました。 そのサイト のんのん技術ブログ 怪しい 別ドメイン（←まぁ本人かもしれんし...） タイトルと記事が全く同じ 投稿記事元のユーザがバラバラ →同一人物が運営しているとは思えない サイト運営者の情報不足 Aboutページ→信頼性がない プライバシーポリシー→なし お問い合わせ→連絡手段なし 広告ばっかり タイトルと記事が全く同じ 左←問題のサイト 右→Qiita プライバシーの保護のため、ぼかしています。 リンクも画像ソースも同じ。 多少デザインを加えていますね。 投稿記事元のユーザがバラバラ どれだけコピーされているか相手の記事の一部を示しま
以前、Instagram API仕様変更・終了・廃止関連の情報まとめ。インスタの写真をWebサイトで直接表示していた方は要注意！という記事を書いたことがありました。 この記事、Arrownの歴代記事の中でもかなりのバズを生み出してくれたのですが、今回のブログ記事は、1年越しの続編の記事になります！（遅い！笑） Instagram API仕様変更・終了・廃止関連の情報まとめ。インスタの写真をWebサイトで直接表示していた方は要注意！ でご紹介させていただいたように、2018年4月、それまで提供されていたInstagram APIの一部機能が終了したことにより、Webサイトに埋め込んでいたInstagramの写真が突然表示されなくなってしまったということがありました。 昨年2018年の段階では、Instagramを運営するFaceBook社側からは、「Instagram APIの代替方法につい
はじめに フロントエンドエンジニアを目指してプログラミングを学習しています。 トンテキと申します。 プログラミング学習のアウトプットとして自作のWebサービス-SHAKYO-を制作、公開しました。 この記事では-SHAKYO-の概要や制作過程について説明します。 URL リンク先はこちら- SHAKYO - 目的 ・フルスクラッチ開発を行うことでWebアプリの基本的な構成、動作を知る ・自作のWebアプリで同じ初学者の方の役に立つサービスを提供したい スペック 使用言語 / HTML５/ CSS3 / Javascript / PHP DBMS / MySQL 開発環境 / MacOS Mojave 10.14.6 バージョン管理 / SourceTree(3.0.15) 本番環境 / xserver 主な機能 ユーザー管理機能 ・ユーザー登録機能 ・ユーザーログイン機能 ・ユーザー編集機
2021 / 2020 / 2019 JavaScriptライブラリのトレンドを紹介しているbestofjs.orgが、2020年に最もホットであったJavaScriptライブラリのランキングを発表しました。 選考基準は現在のスター数ではなく、『2020年の一年間で増えたスターの数』です。 過去流行っていたけど落ち目となった技術は出てこないので、最近注目されている技術がわかります。 ちなみに2016年の総合ランキング1位はVue.js、2017年の総合ランキング1位はVue.js、2018年の総合ランキング1位はVue.js、2019年の総合ランキング1位はVue.jsです。 以下は2020年のランキング、2020 JavaScript Rising Starsの日本語訳です。 JavaScript ライジングスター 2020 5回目のJavaScript ライジングスターにようこそ！ こ
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
【脱jQuery】モダンなJSの書き方 - Qiita
「レストランボード」における大規模フロントエンドの漸進的なVueリプレイスの取り組み
第三の答え、Stimulusjs - Qiita
混沌としたモノリシックRailsを手懐けるためにやったこと - Speee DEVELOPER BLOG
JSのプラグインシステムについて書くJavaScript Plugin Architecture 2.0をリリースしました
はてなブログカテゴリーを分かりやすく階層化表示する設定方法は？ - QUATRE（キャトル）の庭
松本の地でSass/SCSSの邪悪なアンパサンドを撲滅するために立ち上がった - メドピア開発者ブログ
SIerに生息する「おじさんSE」の生態を知る - Qiita
ハンバーガーボタン 何で作ってる？僕なりの作り方を解説してみる。 - Shibajuku
Webフロントエンドのレガシーコードを改善するには？ 一筋縄ではいかないモダナイズ
プチ・クラウドストレージ作ってみた - Qiita
Things you forgot (or never knew) because of React
よわよわRailsエンジニアのジレンマ - 猫Rails
Browser In The Browser (BITB) Attack | mr.d0x
コードベースがでかい・テーブルの規模がでかい・エンジニア人数がでかい SmartHRにおける“でかい三銃士”解決のための取り組み
React部分導入時の開発・検証環境紹介｜食べログ フロントエンドエンジニアブログ
CommonJS is hurting JavaScript
WEAR Webフロントエンドの自動テスト構成 2023 - ZOZO TECH BLOG
WebサイトのUIにさまざまなフローティング要素を実装するためのJavaScriptのライブラリ -Floating UI
サーバーサイドエンジニアがフロントエンドに挑戦して最高の経験になった話 - BASEプロダクトチームブログ
フレームワーク乗り換える必要なし系の意見がもう少し欲しい - laiso
第2章 ブラウザ操作自動化の基本 ～非同期処理を扱うasync/await関数、自動化の鍵を握るPuppeteerコンポーネント | gihyo.jp
JavaScriptの歴史をざっくりまとめたよ! - Qiita
Why We're Breaking Up with CSS-in-JS
Instagram Graph APIの基本的な使い方・Webサイトにインスタの写真を埋め込みする方法
自作Webサービス -SHAKYO- FWを使用せず素のPHPで制作しました - Qiita
JavaScript ベスト・オブ・ザ・イヤー 2020 - Qiita