JavaScript学習ロードマップ - Qiita
JavaScript苦手・・という状況からJavaScript好きになれるロードマップ（多分） 全編ほぼ動画なので、とっても見やすい。挫折しづらい。 全体的な流れとしては、動画見る ▶︎ コードを書いて学習の流れです 個人的に好きなエンジニア系Youtuberのお二人の動画がメインになります Yahoo!出身のエンジニア しまぶーのIT大学さん Web万屋エンジニアチャンネルさん LEVEL ☆ JavaScriptってなに？ そもそもJavaScriptって何？フロントエンドって何してるの？ってレベルを解消 フロントエンド基礎編 / 約40分 LEVEL ★ JavaScript入門編 JavaScriptをマスターするならHTMLを知っておかないかん by 弊社マネージャー HTMLの基礎から、JavaScriptの全体像を学習できます。 HTML入門編 / 約43分 JavaScri
【GitHub超初心者入門】この前初めてGitHubを使い始めたエンジニア見習いが書くGitHubの使い方と実践～とりあえず一緒に動かしてみようぜ！～ - Qiita
【GitHub超初心者入門】この前初めてGitHubを使い始めたエンジニア見習いが書くGitHubの使い方と実践～とりあえず一緒に動かしてみようぜ！～GitHub初心者入門新人プログラマ応援 たくさんの「LGTM」ありがとうございます。 ちょっと別視点からバージョン管理システムの記事を書いてみました。 そちらもよろしければごらんくださいませ。 【Git】オレならこう説明する！Git初心者への用語説明 後、個人ブログもはじめましたのでよろしければ（宣伝） 3年ぶりにこの記事の続きをnoteで書きました。 https://note.mu/nahito/n/nded6e4dd7382 はじめに 「勝利にコミットせよ！」「結果にコミットせよ！」 ……は？ 何を言ってるかさっぱりわかりません． コミットって何？つーかコミットって日本語で言うと何？言ってみろよ！！！ そんなエンジニア見習いがとうとうG
Promiseをthrowするのはなぜ天才的デザインなのか - Qiita
ReactのConcurrent Modeが最初に発表されたのはもう1年近くも前のことです（記事執筆時点1）。Concurrent Modeはたいへん奥深い機能で正式版がたいへん待ち遠しいですが、Concurrent Modeの代名詞として多くのReactユーザーに知られているのはPromiseをthrowするというAPIデザインです。Concurrent Modeでは、コンポーネントがレンダリング時にPromiseをthrowすることで、レンダリングをサスペンドした（Promiseが解決されるまでレンダリングできない）ことを表します。 Concurrent Modeに関しては筆者の既存記事Concurrent Mode時代のReact設計論 (1) Concurrent Modeにおける非同期処理などをご参照いただきたいのですが、ここではPromiseをthrowするということ自体に焦点
スーパーマリオのジャンプのアルゴリズム - Qiita
先日、気持ちのいいジャンプを目指してというQiitaの記事を見かけました。記事中では、マリオのジャンプについても触れられています。マリオというと、マリオブラザースやスーパーマリオブラザース等々、色々あるのですが、これはおそらくスーパーマリオブラザースの事だと思われます。ジャンプアクションゲームといったらスーマリですね。 そのマリオのジャンプの仕組みは「マリオの速度ベクトルを保存しておいて座標を計算するんじゃなくて～」と書かれていて、別サイトのブログへのリンクが張られています。 マリオのジャンプ実装法とVerlet積分 ただ、この記述については不正確であるという別のブログもあったりします。 マリオの完コピvol.28 ジャンプの解析と修正 ホントのところはどうなんでしょうか？世界で最も有名なゲームのジャンプがどのように処理されているのか気になったので調べてみることにしました。 原典にあたる
zshでログイン・ログアウト時に実行されるファイル - Qiita
今まではバカの一つ覚えのように何でもかんでも$HOME/.zshrcに書いていたけど、サーバ管理をよくするようになってきて、複数アカウントの共通設定とかをしたくなったので調べた。 順番 以下の$ZDOTDIRは指定されていない場合$HOMEになる。 ログイン時 /etc/zshenv $ZDOTDIR/.zshenv /etc/zprofile $ZDOTDIR/.zprofile $ZDOTDIR/.zshrc /etc/zlogin $ZDOTDIR/.zlogin ログアウト時 $ZDOTDIR/.zlogout /etc/zlogout 言うまでもなく、個人的な設定は$ZDOTDIRに、汎用的な設定は/etcに書く。 各種説明 zshenv 必ず実行される。/etc/zshenvは上書き不可で$PATHや$MANPATHの設定がされる。 $ZDOTDIR/.zshenvにはいかなる
今すぐJavaScriptデバッグ効率を上げるconsoleテクニック - Qiita
こちらの記事は、2019年9月に公開されたIndrek Lasn氏による『Boost your JavaScript Debugging Skills With These Console Tricks』の和訳になります。 本記事は原著者から許可を得た上で記事を公開しています。 著者Twitter https://twitter.com/lasnindrek JavaScriptにはコードをデバッグするためのツールがたくさんあります。 JavaScriptコードをデバッグするお決まりの方法といえば、コンソールから結果を出力するだけのconsole.logメソッドを使うことでしょう。 十分に機能はしますが、デバッグに最適とまでは言えません。これよりもっと良い方法があれば、試してみたいと思いませんか？ consoleオブジェクトを使えば、ブラウザのデバッグコンソールへのアクセスすることができま
エンジニアが情報収集とトレンドを追うのに読むと良いサイト - Qiita
背景 自分が普段電車や会社で読んでいるIT系のサイトと学習などで使用しているサイトのまとめ。 ニュース系 ■ CNET Japan ■ @IT ■ ITmedia ■ はてなブックマーク(テクノロジーカテゴリ) ■ Menthas ■ Publickey ニュース(ガジェット系) ■ PC Watch ■ GIZMODO ■ Engadget 技術系ブログ(企業系) ■ Developers.IO ■ はてなブログ開発ブログ ■ サイボウズのエンジニアブログ ■ クックパッド開発者ブログ ■ Google Developers ■ Yahoo! JAPAN Tech Blog ■ Mercari Engineering Blog ■ Webnaut ■ バズ部 ■ SOUM/misc ■ LINE Engineering 技術系ブログ(個人) ■ ネットワークエンジニアのメモ ■ プログラ
エンジニアが情報収集とトレンドを追うのに読むと良いサイト - Qiita
背景 自分が普段電車や会社で読んでいるIT系のサイトと学習などで使用しているサイトのまとめ。 ニュース系 ■ CNET Japan ■ @IT ■ ITmedia ■ はてなブックマーク(テクノロジーカテゴリ) ■ Menthas ■ Publickey ニュース(ガジェット系) ■ PC Watch ■ GIZMODO ■ Engadget 技術系ブログ(企業系) ■ Developers.IO ■ はてなブログ開発ブログ ■ サイボウズのエンジニアブログ ■ クックパッド開発者ブログ ■ Google Developers ■ Yahoo! JAPAN Tech Blog ■ Mercari Engineering Blog ■ Webnaut ■ バズ部 ■ SOUM/misc ■ LINE Engineering 技術系ブログ(個人) ■ ネットワークエンジニアのメモ ■ プログラ
UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita
WEBサイトにアクセスしてくる利用者の情報をUserAgentから調べることが出来るが、どんな情報がわかるか調べてみた。より詳しい情報は参考に使ったサイトを参照で。 はじめに GoogleがChromeにおいてユーザーエージェント文字列を段階的に廃止することを発表しています。 段階的にUserAgentが削除版UA文字列に置き換わっていきChrome 113で完全に削減版の UA 文字列となってしまいます。 削除版のUA文字列は以下の通りです。 User-Agent Reduction # Desktop (user on Windows 8.1, for example) # 旧 UA文字列 Mozilla/5.0 (Windows NT 6.3; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/93.0.1234.56
Nuxt.js＋Firebase＋GAEで作った個人サービスが半月で2万PV超えたので実績値を全て公開する - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? こんなサービス作りました 【#拡散希望】 🙌🎉🎊サービス開始🎊🎉🙌 ボケをツイートして 「いいね❤️」「リツイート🔁」 の数でランキング！ Twitter連動型 大喜利サイト 「ついぎり」 サービス開始しました‼️#ついぎりhttps://t.co/bkXfzHyVSs — ついぎり@公式アカウント (@twigiri_app) August 14, 2019 Twitterで大喜利するサービスです。 ８月中頃にローンチしたのですが、有難いことに半月で約2.5万PVいきました。 開発に至ったポエム記事はCrieitに投稿し
富〇通でやっていけなくなった話 - Qiita
前置き 自分には発達障害がありました。 なので、コミュニケーション能力におおきなハンディキャップを抱えて生まれてきました。 しかし、情報系の学校を出ているのでプログラミングは得意でした。なので、その辺の問題は些末な問題だと考えていました そこで地獄を見た うちの会社はプログラミングやDockerの知識などいらなかったのです。 ただ、うえからの命令に従うだけの組織だったのです。 年功序列、これほどこのフレーズが似合う組織はないでしょう。 極めつけがsshをたたかせてほしいという要求も君は新人だから、という理由で一蹴されてしまいました。 gitの導入を試みる VCSがあまりにもおろそかなので、いい加減gitを入れようという話になったのですが、新人の戯言など誰も聞いてはくれません 挙句の果てに障害差別されるありさまでした。gitlabの導入することは暫定で決まったのですが使えるのが自分なのとss
Firebase Extensionsをサクッと試してみた 〜Firebase Extensions機能一覧、Translate Textの使い方〜 - Qiita
2019/09/26にFirebase Summitで発表されたFirebase Extensionsをサクッと試しみたので書きます Firebase Extensions とは？ Firebaseコンソールでポチポチと設定するだけで、既存のFirebaseの機能を補助するCloud Functionsを作成出来る機能です。 Firestorageでの画像リサイズや、Firestoreに保存されたタイミングで任意の言語に翻訳できる機能など以下の9つのExtensionが発表されています。 簡単に各Extensionsの紹介です。（間違っていたらコメントいただけると嬉しいです ） | 名称 | サポート対象 | 機能 | |:---:|------|-----|------------------| | Resize Images | Cloud storage | Storegeに画像が追
堅牢で保守的な最低限度の CSS 設計 - Qiita
CSS 設計でいう保守性とは、新しいルールの追加・更新のしやすさ をあらわす。保守性を高めるためには、変更の局所化、他のルールへの副作用を最小にするアーキテクチャ を採用します。 CSS 設計 設計思想は FLOCSS ベースの ECSS + rscss + Tailwind CSS のいいとこ取り 命名規則は MindBEMding （以降、BEM） 開発言語は Sass + PostCSS コンポーネント粒度 FLOCSS ではプロジェクトにおいて繰り返されるビジュアルパターンをすべて Object として定義します。Object には、Component と Project のレイヤーがあり、この 2 つの判別において Atomic Design のコンポーネント粒度の考えを拝借します。具体的には、 Component：Atoms Project：Molecules に分類します。
コンポーネント指向フロントエンド開発におけるデザイナーの参画について - Qiita
この記事はドワンゴ AdventCalendar 2017の17日目の記事です。 dwangoアドベントカレンダー17日目を担当させていただきます @ln-north です。デザイナーとして2016年度新卒として入社し、もうすぐ2年になります。 エンジニアさんで埋められるカレンダーの中、ひっそりとデザイナーも参加させていただきます、どうぞお手柔らかに…。 はじめに ここ何年かのWebフロントエンド界隈の動きは非常に大きくそして速く、デザイナーから見ても様々なパラダイムシフトが起こっています。scssやwebpackからHTML5やCSS3まで…本当に大変ですよね。 特に最近はReactやVueなど、 コンポーネント指向 のWebシステム開発が発展を遂げています。Web Componentsなども含め、流れを見てるとおそらくWebはこのコンポーネント指向に向かい、しばらく進んでいくのだろうと
JavaScript で forEach を使うのは最終手段 - Qiita
この記事は JavaScript2 Advent Calendar 2018 の1日目の記事です。 こんばんは。@diescake です。 今年は、JavaScript 経験の浅い新人さんや外注さんをリードする立場として、 とにかく幅広いメンバーのコードレビューをする機会に恵まれたのですが、 事ある毎に Array.prototype.forEach を利用する人が多かったため、初心者向けに要点を整理してみました。 以下 ES2015 以降のバージョンをサポートするブラウザ、あるいは polyfill を利用していることを前提としています。 結論 配列に対して何らかの操作を行う際は、 filter, find, map, reduce などのメソッドを利用できないか検討し、 いずれのメソッドでも実現ができない場合の最終手段として forEach を選択しましょう。 下記に、いくつかのサンプ
CSSのクラス名を決めるときに使うリストをつくりました
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? CSSは設計手法も大事ですが、どういう単語で名前をつけていくかも大事だと思っています。 個人個人でばらつきが出るところでもありますし、「単語名 英語」で検索をして探した単語を使ったけど若干意味合いが違ったといったこともあると思います。 クラス名を決めるためのリストを見かけることもありますが、英単語の読みは書かれていても意味合いが書かれていることは少ないように思います。 自分の確認用と、チームで製作するさいの基準になるようなものを作りたいと思い、単語とその意味を短くまとめてGitHubにあげています。 CSS クラス名リスト | GitH
JSDoc使い方メモ - Qiita
JSDoc で API ドキュメントを生成する方法と、一部のドキュメンテーションタグの使い方についてメモする。 環境 OS Windows7 64bit Java 1.7.0_51 JSDoc 3.2.2 インストール Java Mozilla Rhino を使った方法でドキュメントを生成するので、 Java が必要。 インストール方法は割愛。 JSDoc 3 GitHub からダウンロードできる。 tags から v3.2.2 を選択して、 zip でダウンロードする。 zip を解凍したら、解凍後のフォルダにパスを通し、コマンドラインからヘルプを表示できることを確認する。 >jsdoc --help OPTIONS: -t, --template <value> The path to the template to use. Default: path/to/jsdoc/templa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
JavaScript の デコレータ の使い方
JavaScriptでユニークな文字列をさくっと生成する - Qiita
parcel+riot.js v4でstyleタグの挿入が上手くいかなかったときの対処法 - Qiita
