ファイルダウンロード完全マスター | フューチャー技術ブログ
Real World HTTPでも紹介したネタですが、お仕事で受けている技術コンサル中に質問をいただいた時に、微妙に本で紹介した内容では少し足りなかったので、改めて整理のためにブログ記事にしてみました。次回、本が改訂されることがあればこのブログエントリーの内容も入れて加筆したいと思います。 Real World HTTPだとGoを使っていましたが、フロントとサーバーを同時にいじるので、本エントリーではNext.jsをサンプルに使います。Next.jsでプロジェクトを作って（npx create-next-app@latest –ts)、適当なプロジェクト名を入れてアプリケーションの雛形を作っておいてください。 Next.jsでは、1つのスクリプトファイルを作成すると、それがサーバーAPI(/pages/api以下)と、フロントの画面(/pages/以下のapi以外)になります。Next.j
Chrome拡張 つくりかた 令和最新版
数年ぶりにChrome拡張のつくりかたを調べた。 本当に何も分からなかったので、Twitterで「2022年にChrome拡張つくりたかったら何見て学べばいい？」とつぶやいてみたところ、何人かの人が教えてくれた。教えてもらった中から幾つかのリンク先を紹介するような形で記述していく。 Create a Vite-React Chrome Extension in 90 seconds - DEV Community 2022年時点だと比較的新しめのフロントエンド向けツールであるviteと、viteのChrome拡張向けプラグインである@crxjs/vite-pluginを使ってChrome拡張をつくってみよう、という記事。今回自分は主にこれを参考にしながら開発を進めた。Reactと言っているが、自分のChrome拡張ではUIは存在しなかったので、Reactに関する部分は読み飛ばして、vite
JavaScriptを完全無料で学習できる最強の厳選コンテンツを大公開！ - paiza times
どうも、まさとらん（@0310lan）です！ 今回は、JavaScript初心者から中級者までをカバーできる学習コンテンツを厳選してご紹介します。 完全無料で公開されているものばかりを集めており、なおかつ質の高いコンテンツを選んでいますので独学したい方にも最適です。テキスト、動画、本、Webアプリなど、さまざまな種類のコンテンツを楽しみながらぜひ学習に役立ててください！ ■学習を始める前に これからJavaScriptの学習コンテンツについて解説をしていく前に、ひとつだけ以下のサイトをご紹介しておきます。 【 The Modern JavaScript Tutorial 】 これはJavaScriptの基礎構文・DOM操作・非同期処理・サーバ通信など、ほとんどの学習項目を網羅したリファレンスのようなサイトです。海外で作られたサイトですが、うれしいことに日本語化されているので初心者にも扱いや
株式会社リクルート エンジニアコース新人研修の内容を公開します！（2021年度版） | Recruit Tech Blog
こんにちは！ Webフロントエンドエンジニアの眞野 隼輔です。 毎年大きな反響を頂いている、エンジニアコースの新人研修の内容を紹介させていただきます。 研修の概要 リクルートでは、エンジニアコースでスペシャリスト採用された新卒のエンジニアを対象に、現場で培われた「本当に必要な生きた知識・技術」を取り入れた新人研修を開催しています。 前半は研修では各分野に長けた社員による講義形式の技術研修を行い、後半は仮配属という形でそれぞれ別の部署に配属されて実際の業務を経験するOJTとなっています。 この技術研修はそのほとんどが内製されており、ベテラン社員による経験を元にした講義を通して生きた知識・技術を獲得できます。また、実際に手を動かす演習型の講義ではベテラン社員からのレビューやフィードバックを得られるため、知識の定着や更なる成長へと繋がります。 本年度の技術研修も、昨年度に引き続きフルリモートでの
動くWebデザインアイデア帳
サイト閲覧方法 1ウェブサイトへアクセス https://ugokuweb.coco-factory.jp/ugokuweb/ 新サイトはこちらから 2【ユーザー名】と【パスワード】が求められますので、以下の情報を入力してください。 【ユーザー名】：ugokuweb 【パスワード】：指定のページ数を【半角数字3桁】で入力 （例）30ページの場合は 030 と入力 ※黄色本をご購入の方：7-2「検索」の表紙ページ数 ※ピンク本（実践編）をご購入の方：9-4「SVGアニメーション」の表紙ページ数を【半角数字3桁】で入力してください。 3閲覧制限が解除され、サイトを閲覧できるようになります。 ブックマークをしてご利用ください。 ※掲載されているコードは、2021年に出版された時のものをそのまま掲載しています。 （jQueryのバージョン、プラグインのソースコードの書き方を含む） ソースコードの書
Chrome Devtoolのmonitorを使うと関数の呼び出しを観察できて便利 - ぱすたけ日記
を読んで思い出したのでご紹介です。 元の記事と同様に以下の関数 sum について、 function sum(nums, acc = 0) { console.log({ nums, acc }); if (nums.length === 0) return 0; if (nums.length === 1) return nums[0]; return sum(nums.slice(1), acc + nums[0]); } この関数sumの引数 (nums と acc) の呼び出しごとの変化を見たい場合は、所謂プリントデバッグや debugger を使うのは一般的なテクニックとしてよく知られていますが、このような関数呼び出し時の引数を知りたい場合はmonitor(function)という関数を使うことで同様の効果を得ることが出来ます。 この場合は monitor(sum)とした後に、関
メディアと広告のフロント周りを見ている自分がよく使う不具合調査のときのChrome DevToolsの機能(tips編)
と入れてみましょう。 「740」という値が返ってきています。 ここからウィンドウのサイズを変えてみましょう。狭めてみます。 自動実行されて返ってきている値が「556」に変わっているのが分かります。 こちらは名前の通りライブで自動実行し続けます。更新は250ms毎です。 さらに特徴としては、Live Expressionはページがリフレッシュしたり別ページに遷移しても自動実行してくれることです。 使用シーンとしては、例えばリダイレクトが絡む遷移でリファラを確認したい場合などで、都度「Console」なり「Snippets」に を書いて実行する手間を省くために、「Live Expression」で自動的に変化をみたい場合などです。 その他グローバルオブジェクトのプロパティの変化について見たい場合などでも、役に立つと思います。 ページの任意のiframe内で任意のJSのscriptを実行させてみ
プログラマーから見た、SCSSの正しい(かもしれない)使いかた - Qiita
SCSSとは SCSSというのは、CSSのアレなところを何とかしようという目的で作成されたメタ言語です。詳細は省略します。 なにそれ？ ってかたは、コチラなどがわかりやすいのではないかと思います。 CSSのメタ言語Sass(SCSS)、LESSの完全入門 でですね。 ここで大事なのは、こいつは要するにCSS周りの技術ですので、つまるところは基本「デザイナーさんが使う」ものである、というところです。 彼らは概して、非常におおらかで、健康的で、寛容です。私たちサーバーサイドエンジニアのように、細かいことで「こんな仕様は許されんな！」「なんだよこの仕様設計したヤツって○○じゃねーの？」などとイラついたりしません。 なので、あんな欠点だらけのクソ規格であるCSSにも、特に気にしたりしないらしいのです。 ところがやはり、中には「CSSのそーゆーところって、やっぱ問題だよねー」って思う人々もいたらしく
まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 ..
まじな話をすると、N予備校のプログラミング入門コースやるのがオススメ。 https://www.nnn.ed.nico 一日8時間勉強時間があるなら、だいたい一ヶ月で終わる内容。 月額1000円だけどしっかり勉強すれば一ヶ月の無料期間中に終わると思う。 もともとN高等学校のノンプログラマーの生徒をWebエンジニアとして就職させるために作られたカリキュラムで講師曰く去年はこれで二人エンジニア就職を決めたらしい。 内容も相当親切に説明していて、プログラミングで何か作るだけじゃなくて、就職に必要な環境構築やセキュリティまでみっちりやる。 http://qiita.com/sifue/items/7e7c7867b64ce9742aee#%E3%82%B3%E3%83%B3%E3%82%BB%E3%83%97%E3%83%88%E3%82%92%E3%82%82%E3%81%A8%E3%81%AB
学生時代に知っておきたかったWeb技術の学び方の学び方 | リブセンス
「プログラミングを学ぼうと瞬間最大風速的に意識は高くなるものの、一人でいると気がついたら一日ソシャゲして夕方頃に『また今日も勉強できなかった』と自己嫌悪。」モチベーションが続かない時の対策をはじめ、学び方、学べる環境の作り方をまとめています。
SPAがネイティブアプリをぶっ壊す：HTML5/Javascriptが変えるWebの未来 - Qiita
はじめに タイトルは半分釣りですが、半分本気で考えてもいます。 近い将来、Webアプリが今のネイティブアプリの市場を超えてくる、と仮説を立てています。 ぜひ、先人のみなさんのご意見やお考えを教えてください。 SPAについて SPAとはなにか（What） 歴史 佐川夫美雄さんのイベントレポートの一部が、非常にまとまっていてわかりやすい部分でしたので、まず引用させていただくこととします。 RIAはアプリケーション利用者に対し高い評価を得ましたが、2010年のAppleショックにより衰退の方向へ向かいます。具体的には2010年にSteve JobsがFlashを激しく批判したことに端を発します。プロプライエタリ(Proprietary Software)なFlashよりオープン性のあるHTML5を推進するようになりました。2011年にはMicrosoftがWeb開発者に対してSilverligh
伊藤直也氏が「Web開発は高度化している」と語る理由と、押さえておきたい3つの技術領域【2014年前半のインプットlog】 - エンジニアtype
KAIZEN platform Inc. Senior Technology Advisor 伊藤直也氏（@naoya_ito） 2002年に新卒入社したニフティでブログサービス『ココログ』の開発担当となり、一躍有名になる。その後、はてなで『はてなブックマーク』など各種サービスを立ち上げ、2010年にグリーへ入社。2012年に同社を退職して以降は、フリーランスとしてベンチャーの技術顧問などを請け負う。自身のブログ『naoyaのはてなダイアリー』が人気 「Webアプリの実装で差別化は無理」という考えが変わった 現在、KAIZEN platform Inc.をはじめ複数社の技術顧問を務めている伊藤直也氏。「普段から、アウトプットの目的なく技術の勉強をすることはほとんどない」という性分から、今年上半期は「顧問としてベストプラクティスを提供するために知っておくべき領域」にフォーカスして情報収集を
これからAndroidの開発を始める人がお世話になるだろうサイト一覧 - genonymous
こんにちは、釘宮です。 新しい言語の開発を始めたとき、検索という行為が結構大きな時間を食ってしまうものです。 その検索を効率的にするのに有効な手段として、熟知している人の情報源を知る事が一つだと思います。 ということで今回、Android開発歴3,4年の私、釘宮の情報源を少数精鋭で紹介したいと思います！ 言わずもがな ○ Android Developers まずはAndroidの公式デベロッパーサイト。 関数の仕様などリファレンス一覧以外にもDesignなどでGoogleのすすめるこれからのAndroidの標準デザインなどは必読です。 ３種の神器 ○ Stack Overflow このサイトなしでプログラムをくみ上げることができるのか？いや、むりだろう。 という方も多いのではないでしょうか？ 幾度となく我々プログラマを救ってくれたStackOverflowさんはAndroidも十二分
スマートフォンサイトのコーディング Tips あれこれ | バシャログ。
ゴールデンウィークはゴールデンに過ごせそうにない Latin です。 今回はスマートフォンサイトのコーディング周りでのあれこれをまとめてみます。 先日の macky の記事、「スマホサイトの矢印付きメニューをCSSのみで実装する。」もあわせてご覧ください。 viewport 系の設定 描画サイズをデバイスの横幅に合わせる、拡大縮小を不可に これが一番よく見る形式でしょうか？ <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"> 文字サイズの自動調整をオフにする 各スマホブラウザでは、横向きにすると text-size-adjust の処理が走り、自動で文字サイズを最適化（拡大）する機能があります。 読
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
フロントエンドのデザインパターン
GitHub - zgw426/Handling_JSON_with_no_web_server_HTML-JavaScript-
JavaScript Promiseの本
【2018年版】フロントエンドエンジニアがよく使うWebサービス・アプリまとめ - たこさんちゃんねる(別枠)
モダンWebシステム開発
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
