JavaScriptでスマホアプリを作る7つ方法 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ・ヮ・）あ、おはようございまーす JavaScript でスマートフォンアプリを作る方法を調べる機会があったのでまとめました！ 細かいアーキテクチャに関しては割愛します ネイティブアプリ 1. React Native ★89.9k React でネイティブアプリを開発できるフレームワーク JavaScript でアプリ開発といえばこれですね！ Expo という React Native での開発をサポートするプラットホームを使うと ネイティブ機能を使うためのプラグインに制限がかかりますが 簡単に実機で確認したりAppleの審査なしにア
10 Modern JavaScript Tricks Every Developer Should Use
You must have seen the guy in the picture above. He simplifies everyday things — and that’s exactly what we are going to do with JavaScript in this article. JavaScript has a lot of cool features that most beginner and intermediate developers don’t…
Canvasで書いたものを画像に変換する | カバの樹
ルート営業を行うクライアントから、タブレットの契約書に手書きで署名できる機能が欲しいと言われました。 アプリで作ろうか悩みましたが、試しにHTML５で実装したものを提案してみました。 署名を画像にして保存する 署名したものを画像に変換します。 そして、書いたものを消せるように消しゴム機能も実装しました。 ソース <canvas id="canvassample" width="500" height="300"></canvas> <div> <button type="button" onclick="colorCange(0)">ペン</button> <button type="button" onclick="colorCange(1)" >消しゴム</button> </div> <h2>画像出力<h2> <div id="img-box"><img id="newImg"></
iframe で複数の管理画面を1つの統一されたサイトに見せるパターンのまとめ - RAKSUL TechBlog
こんにちは。エンジニアの二串です。普段はサーバサイドの開発をしていますが、今日は最近仕事で取り組んだフロントよりの話になっています。 iframe を使って複数の管理画面サイトをあたかも1つの統一されたサイトとして見せるパターンをまとめます。 iframe を使って別サイトをはめ込むことは簡単ですが、実際複数ページあるサイトをはめ込もうとすると、ただ iframe を使うだけでは力不足です。例えばiframe内でのページ遷移、高さ調整、パーマリンク等で問題を感じます。 今回紹介する tips のいくつかはインターネット上で見つけられますが、今回の複数管理画面を1つにマージするという視点でまとまった記事は見つけられなかったので、まとめたら便利なのではとおもい記事にまとめました。 コードスニペットを以下で掲載していますが、より詳しくはデモアプリも併せて見ていただければとおもいます。 背景 移行
トランスパイラ「Babel」の開発チーム、「何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」。資金難により寄付を訴え
トランスパイラ「Babel」の開発チーム、「何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」。資金難により寄付を訴え 「Babel」は、JavaScriptコンパイラもしくはトランスパイラの代表的なツールとして知られており、FacebookやSpotify、Slack、MongoDBなどさまざまな企業や開発現場で使われています。 そのBabelの開発チームが資金難になっていることを、開発の中心となっているコアチームがブログ「Babel is used by millions, so why are we running out of money?」（Babelは何百万人にも使われているのに、なぜ私たちの資金は尽きようとしているのか？」で明らかにしています。 Babelとは、ECMAScript 15以降のいわゆるモダンなJavaScriptの構文や機能を活用して書
React入門！！の前に知っておきたいNode.jsとJavaScriptの知識 - Qiita
対象読者とこの記事から何が得られるのか そろそろReactの勉強をはじめてみたい、勉強したいと思っているけど、以下のようなことを考えて前に進めない方向けの記事です。 JavaScriptの知識レベルはこれくらいで足るのか？ 他に知っておくことはないのかな？ この記事を読むことでReact入門の前に知っておきたいNode.jsとJavaScriptの知識を得ることができると思います。 Node.jsをざっと知る Node.jsを簡単に言うと JavaScriptをブラウザではなくPythonやRubyなどと同じようにターミナル上で動かすことができるようにするための実行環境のことであり、バックエンド言語としてJavaScriptを使うことができ、ファイル操作などのOSの機能にアクセスできます。 公式ページだと以下のように記載されています。 Node.js はスケーラブルなネットワークアプリケー
Reactを自作しよう
この記事は Build your own React を翻訳したものです。 Reactを1から書き直していきます。 実際のReactコードのアーキテクチャに従いますが、最適化機能と必須ではない機能は今回は実装しません。 Step 1: createElement関数 Step 2: render関数 Step 3: 並列モード Step 4: ファイバー Step 5: Render Phase と Commit Phase Step 6: 差分検出 Step 7: 関数コンポーネント Step 8: Hooks Step 0 復習 最初にいくつかの基本的な概念を確認しましょう。 React、JSX、およびDOM要素がどのように機能するかをすでに理解している場合は、この章はスキップしても構いません。 今回は、次のわずか3行のコードをReactアプリの例として使用します。 const ele
ECMAScript 2015 の分割代入は奥が深かった
はじめに 配列やオブジェクトの個々の値を各々の変数に代入する事ができる「分割代入」というのが登場しました。 結構便利そうではありますが、具体的にどのような事ができるのでしょう。 ECMAScript 2015 (ES2015 / ES6) にまだ慣れない人向けと、自分のためのメモとして置いておきます。 基本編 おそらく一番使うであろう書き方です。 配列 通常、配列から値を取り出すときはインデックス（添字）を指定してやらなければいけませんが、分割代入ではまとめて変数に代入できるので便利です。 /* 一個ずつ取り出す場合 */ var individuals = ['早坂美玲', '森久保乃々', '星輝子']; var cute = individuals[0], cool = individuals[1], passion = individuals[2]; console.log(cut
[ES6] const で export default ができない理由 | ocws BLOG
ホームページ制作コーポレートサイトからLP制作、オウンドメディアサイト、ECサイトなどさまざまなニーズにお応えすることができます。システム開発Webサービスなど、フロントエンド、バックエンドを踏まえた構築が可能です。SEOコンサルティング内部対策をメインにお客様の色にあったSEOコンサルティングを展開してまいります。HTMLメール制作通常のHTMLメールからレスポンシブ対応したHTMLメールまで多岐に渡り制作することが可能です。ECコンサルティングページ準備中ページ構成変更やアクセススピードの改善などページ内施策などサイト全体のブランディングを含めたコンサルティングをメインにお手伝いいたします。保守・運用ページ準備中WordPressやECツールなどを使用したサイトの保守と管理を行っております。
![[ES6] const で export default ができない理由 | ocws BLOG](https://cdn-ak-scissors.b.st-hatena.com/image/square/832af004b8e6ceb6cf7ede2ca748df61a758d493/height=288;version=1;width=512/https%3A%2F%2Focws.jp%2Fstatic%2Fd6f6022425a9e1dc8ac3083256d51b27%2F497c6%2Fmv_es6_export_default_const.png)
Node.jsのECMAScript Modulesの紹介 - hiroppy's site
Login to Meetup | Meetup Find groups that host online or in person events and meet people in your local community who share y... ECMAScript Modules とは？ JavaScript には、AMD や UMD、CJS のような多くのモジュールシステムがあります。 ECMAScript Modules は当初 ES2015 に入る予定でした。 さて、ESM の仕様は WHATWG と TC39 が管理しますが、役割が違います。 TC39 は ESM のシンタックスや JS のルールを管理します。 例えば、モジュールは strict mode になるとか、thisの扱いとか。 しかし、モジュールの読み込みに関しては、WHATWG が管理します。 理由は、
Node.js Dual Packages (CommonJS/ES Modules) に対応した npm パッケージの開発 - Cybozu Inside Out | サイボウズエンジニアのブログ
こんにちは。フロントエンドエキスパートの平野（@shisama_）です。 フロントエンドエキスパートチームでは業務時間の 30 % の時間で技術探究を行っています。 今回は探究した技術の中から Node.js の ES Modules（以下 ESM）についてと Dual Package (CommonJS/ES Modules) に対応した npm パッケージの開発について紹介します。 ES Modules の特徴 ESM はブラウザ互換 ESM は Strict モード ESM は非同期 ESM は静的解析可能 Node.js の ESM 対応について Dual Package（CJS/ESM）に対応した npm パッケージの開発 Conditional Exports によるファイルの指定 .mjs と .cjs require など CJS 特有の機能を使う ESMから CJS ファ
JavaScript入門: 基礎知識をGIFアニメで分かりやすく解説 -総まとめ
JavaScript QuestionsのLydia Hallie氏の「JavaScript Visualized」シリーズすべての翻訳を完了したので、まとめて紹介します。 JavaScriptエンジンの仕組みをはじめ、イベントループ、スコープチェーン、プロトタイプ継承、非同期処理、ジェネレータ関数、Hoisting（巻き上げ）など、GIFアニメを使用して詳しく解説しています。 シリーズ7本すべてと、プラス1として楽しく学べるクイズもあります。 JavaScript イベントループの仕組み JavaScriptでエラーの原因となるHoisting（巻き上げ）の仕組み JavaScriptのスコープチェーン・変数参照の仕組み JavaScriptエンジンの仕組み JavaScript プロトタイプ継承の仕組み JavaScriptのジェネレータ関数とイテレータの仕組み JavaScriptの
JavaScriptのFetch API について - Qiita
(20) [{…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}, {…}] lastIndex: (...) lastItem: (...) 0: {rendered_body: "<h2>...</h2>", body:"...", ...} 1: {rendered_body: "<h2>...</h2>", body:"...", ...} <<中略>> 19: {rendered_body: "<h2>...</h2>", body:"...", ...} length: 20 __proto__: Array(0) XMLHttpRequestを使うよりはシンプルですし、jQuery.ajaxやaxios.getのようにライブラリに依存しません。
2020年のフロントエンドエンジニアの技術スタックの一例
年の瀬なので、私自身が今年利用した技術をベースに技術スタックをまとめてみようと思います。 とはいえ Web Standard といった広い対象から、フレームワークやライブラリまで、粒度の違うものを全て言及するのは無理があるというもの。特に強く言及できるものは個別で説明しつつ、最後に利用する機会がなかったものも最後に記載する形で。 以下常体。 追記: マイナー企業のようなので一応書いておきますが、筆者は本業ではLINE株式会社という組織でいわゆるエンジニアリングマネージャーと言われるような業務とその採用に関わる仕事をしています。 利用した技術一覧 HTML/CSS/JS みたいなことを書いてるとキリがないので、独断と偏見で区分けして適宜漉いています。特に利用する機会が多かったものは太字でピックアップ。 Frontend Language/Platform TypeScript JavaScr
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - GoogleChromeLabs/comlink-loader: Webpack loader to offload modules to Worker threads seamlessly using Comlink.
Sequelize + Jest のユニットテスト環境構築手順 - Qiita
express と jest だけでサックリとテストを書く！(superagent とか使わない)
【codegen は難しくない】Swagger から JavaScript ( TypeScript ) コードを自動生成してコーディングを効率化しよう
【JWT】 入門 - Qiita
【ECMAScript】importでSyntaxError - Qiita
