（基礎編）jQuery使いのエンジニアがReactとNext.jsでWebサイト制作するために最低限押さえておきたいコード
なぜ書いたか 筆者もWebサイト制作をそこそこ長くやってきておりいまは業務でVueを書いたりちょっとReactを書いたりSvelteを書いたりしていますが、2年前くらいまではReactやES6の構文すら書いたことがありませんでした。 WordPressでのサイト制作が多く、機能が少ないサイト制作会社ではjQueryで充分なことも多く、恥ずかしながら業務時間外での学習や外部の情報を追うこともしていなかったため、開発系の技術スタックに慣れるのにかなり時間がかかりました。 まずはよく使うコードを見て解説しながら答えの一つを示し、よく出てくるコードをざっくり理解して書けるようにすることで、実務でReactを取り入れる取っ掛かりになればいいなぁという思いでこの記事を書いています。 続編は多分今月中に書きます。 こちらは基礎編です。 対象者 普段jQueryでWebサイトを制作している 生のJSはあん
【Vue.js入門】の執筆者が語る！ Vue.jsで押さえておきたい５つのポイント - FLEXY（フレキシー）
※本記事は2019年11月に公開された内容です。 JavaScript用のフレームワークの中でも高い採用率を誇るVue.js。そのVue.jsをこれから学び始める方は、学び方を教えてほしい、有識者の話を聞きたいと考えたことはありませんか。本記事では、「Vue.js入門 基礎から実践アプリケーション開発まで」の著者である手島拓也氏にVue.jsを学ぶ前に知っておきたいポイントを語っていただきます。Vue.jsの勉強方法や手島氏の経験を知ることができるので、ぜひご覧ください。 学ぶ前にまずはどんな案件があるか知りたい方は、FLEXYで取り扱っているVue.js案件をご覧ください。 私のエンジニア史とVue.jsに出会うまで 先日、慶應義塾大学矢上賞（起業支援）授与式で招待講演をする機会がありました。その際にも強烈に感じたのですが、Vue.jsと私のエンジニア史を切り離して語ることはできません。
スナック「jQuery」 - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? ……あら、いらっしゃい。 若いお客さんなんて珍しいわねえ。昔は、この街一番の人気店でね、若いお客さんもたくさんいたんだけどさ。最近はめっきり減っちゃってね。 何飲む？ ……水割り？ わかったわ。 じゃあさ、ちょっとだけ、あたしの昔話に付き合ってもらってもいいかしら。 What is jQuery? この店――『jQuery』がオープンしたのって、2006年なんだけどさ。その頃の、この街の様子って覚えてる？ ……知らないか。あなた、まだ若いもんね。その頃って、そりゃあヒドイもんだったのよ。 その頃、シェア率トップだったブラウザって、もちろ
ep.13 Crowi はじめました - Node.js-based OSS Wiki | UIT INSIDE
@kawasako が @potato4d に UIT コミュニティで使い始めた OSS の Wiki 「Crowi」について聞いてみました。 Crowi とは https://site.crowi.wiki/ メルカリの sotarok さんが開発した OSS の Wiki システム メルカリ社内のナレッジベースとして実際に利用事例あり モダンで親切な OSS システム Markdown で書ける Heroku Button ですぐに運用を始められる 全体的な雰囲気がモダン 技術的にもフロントエンドエンジニアにとって面白そうなもの Crowi の使いドコロ コミュニティだと使いやすそう コミュニティは SaaS 利用が大変 誰が予算もつ？ 管理体制は？ Crowi だと立てやすい 他のツールと比較しての利点 開発者コミュニティにとって Markdown は優しい パスベースのドキュメント
未経験から7日間でコーダーとして現場投入させるまでのカリキュラムを忘れないようにメモっとく - Qiita
エンジニア不足と言われて久しいですが、できる経験者を採用するのはますます難しくなっていますね。 そんななか、弊社ではひょんな縁からエンジニア未経験の新人をエンジニアとして採用することになりました。未経験とはいえ、弱小企業の弊社には悠長に育てている余裕がないため、7日間で現場投入を目指してカリキュラムを組みました。 だいたいうまくいったので、メモがわりに晒しておきます。 前提条件 誰でも7日間でエンジニアになれると言っているわけではありません。あくまで一例として捉えていただければ幸いです。 担当してもらう予定の領域 HTML/CSS コーディング JavaScript はそこそこで（動きのエフェクトやカルーセルを仕込める程度） concrete5 テーマの開発（PHPファイルに foreach を入れていくイメージ、WordPress と変わらない） 流石にアプリケーション開発で7日間は無理
How to a Add File Upload Feature in PHP With jQuery AJAX
Why Use PHP, jQuery, and AJAX? PHP makes file uploads easy. You can upload text or binary files with a few lines of code. PHP gives you full control over the uploaded files through its authentication and file operation functions. Before uploading a file, checking its type, size, and dimensions is important. This is called data validation. PHP stores details like the file’s name, size, and temporar
jQuery Bracket
jQuery Bracket library [server] jQuery bracket is a jQuery plugin that lets users create and display single and double elimination brackets for tournament play. NEWNeed a tool for round-robin tournament groups? Check out the new jQuery Group library that's under development! Installation and project sources You can use npm or bower to install the library as a dependency to your project. npm instal
Vue.js初心者向け：Vue.jsとaxiosでJsonを取得してコンポーネントに反映するメモ - Qiita
はじめに Vue と Ajax を組み合わせて非同期で Json を取得するサンプルは意外と見付かりません。今回の実装もものすごく初歩的な方法ですが、自分的には丸1日悩んだ結果なので今後のためにメモを残しておきます。 むしろエレガントな方法を教えてください。 やりたいこと Vue インスタンス作成前ではなく、作成後にコンポーネント側で Json を取得したい。 データは専用のストアを用意して複数のコンポーネントで使い回したい。 しかし Vuex は制約がキツいので使いたくない。 Json を取得したらコンポーネントに反映したい。 コンポーネントは単一ファイルコンポーネント（.vue）を使いたい。 jQuery ではなく axios を使う axios とは Vue のドキュメントで推奨されている Ajax通信ライブラリです。jQuery を使ってもいいのですが、せっかくなので試してみました
Backbone.js 使い方メモ - Qiita
Backbone.js を勉強した時のメモ。 Backbone.js とは CoffeeScript, Underscore.js などの作者である Jeremy Ashkenas が作っている JavaScript フレームワーク（jashkenas/backbone | Github）。 クライアントサイドで MVC を実装するための下地（骨組み）を提供する。 Angular.js がフルスタックで様々な機能が用意されているのに対して、 Backbone.js はあくまで Backbone（背骨）であり、骨組みを用意するのみ。 双方向のデータバインディングなどの機能はない。 肉付けをするのは、プログラマのお仕事。 機能が少ない分、覚えることは Angular.js に比べれば少ない、と思う。 Hello World 用意するファイル Backbone.js 本体。これがないと始まらない
【jQuery】.on clickイベントが効かない時の対処方法 - Web関連あれこれ
jQuery1.8ぐらいから、 .click(function(){}) →.on('click', 'id', function() {}) ↑で書くべし的な事を言われてちゃんと.onで書いているのになぜか？効かない。。。 1時間ぐらいハマったのでメモ。。 1. まずはjQueryのバージョンを確認 .on()メソッドはjQuery1.7に登場ですので、 当然それより前のバージョンでは使用できません。。 意外と見落としてしまいます。 レスボンシブ対応の比較的新しいサイトでv1.5.2が使われていた。。なんて事もありました。 わりとよく使うjs系をテンプレセットにして何年も使う会社もありますし、古いサイトのメンテやセミリニューアルなどで物凄く古いjQuery Libraryに出会う事もあります。 ＊ファイル名が「jquery.js」とバージョン名が書かれていない物は、中身（ソース）を見て上
high-performance-sticky-sidebar.html
サイドバーをスクロールに合わせて、ぴたっとくっつける快適に動作する超軽量スクリプトを紹介します。 コンテンツが長い・短い場合はもちろん、サイドバーが長くてビューポートをはみ出す場合にも期待通り完璧に対応します。スクリプトは単体で動作し、jQueryのプラグインとして動作させることも可能です。 スクロール時にすべてのサイズを計算するのではなく、必要なサイズだけを再計算。 スクロール時のラグやジャンクを発生せず、リフローを起こさずにスムーズに動作。 サイドバーとコンテナのサイズが変更された時は、それらのサイズを正確に再計算。 特定の状況下でフックするために、イベントトリガーを用意。 コンテナが長くても短くてもサイドバーを扱うことができます。 他のスクリプトへの依存はなく動作。 jQueryやZeptoのプラグインとして利用することも可能。 実装はスーバー簡単！ Sticky Sidebarのデ
【小ネタ】Chromeのローカルセキュリティポリシーの回避 | DevelopersIO
こんにちは。ともだです。 Chromeではセキュリティの関係でローカルファイルからローカルファイルの読み込みができなくなっています。(Chrome5からの仕様ですね) ひとまずサーバ立てずにhtmlをローカルで動作確認しようとした事がある人なら結構おなじみの現象かと思います。 これを回避するには、Chromeの起動オプションに「–allow-file-access-from-files」を付ければ良いわけですが、winの場合にはアプリのショートカットアイコンのコンテキストメニューからプロパティを開いてショートカットタブのリンク先にchrome.exeに続いて「–allow-file-access-from-files」を入力します。このショートカットを使えばローカルファイルからローカルファイルの読み込みができます。 で、macの場合にどうするか迷う人が結構いるみたいなのでメモ書きしておきま
「Reactの難しさ」を分解しよう - タオルケット体操
他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 「テンプレートエンジン」として捉えて、シンタックスを攻撃するのをやめよう ライブラリとしてのReactはとても簡単 Reactの思想を理解するのはチョットムズカシイ 環境構築が難しい JavaScriptそのものが難しい GUIが難しい jQuery時代からのパラダイムシフト フレームワーク関係者の情報量が多い SPAはとりわけ難しい まとめ ずっと感じてたもやもやを書き連ねたら長くなってしまったが、ぼんやりとReactとかなんか難しそうだしめんどくさいから新規案件だけどjQueryでやろっかなどうしよっかなーと迷っている人の指針になってくれればうれしい。 他のライブラリと比べるまえに まず、ReactとjQueryと比べるのはやめよう 出た時から延々と言われ続けているものの、やっぱり今でもjQueryとRe
Visual Studio 2017のインストーラにElectronが使われてる - Qiita
本日 Visual Studio 2017 が正式リリースされました キーノートだけでもと思いぼーっと放送を眺めていましたが，Live Unit Testing や コードリファクタリング周りが印象に残った部分でした． で表題ですが，インストーラを使って少しUIで ん？ っと思った方もいらっしゃると思います． 気になる...気になりますよね? ということでインストーラのディレクトリを見てみましょう． C:\Program Files (x86)\Microsoft Visual Studio\Installer 以下にインストーラが展開されています． そのディレクトリには node.dll の文字が...ん，これは... そしてディレクトリとして Assets, locales, resourcesとなんとも見覚えのある様なディレクトリ構成です． そこで resources 以下を見てみる
Ruby on RailsのAjax処理のおさらい - Qiita
Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article? 何気に、アプリケーションで取り扱うデータ量が増えた場合や、大容量データをデータベースとやり取りする時なんかは、Ajaxを使ってデータ通信をバックエンド側に押しやることで、WEBフロント側のUXからパフォーマンスの悪さを改善できたりする。また、ネットワーク経路的にproxyサーバとかを中継するような環境間でデータのやり取りをする場合などに、proxy側で接続時間にリミットがかけてあったりすると、通常アクセスではデータ通信時間がリミットに達して503エラーとかになってしまうような処理でもAjaxで通信をバックエンド化することで、回避できたり
Rails4アプリに対してクロスドメインでAjaxでCookieを送信したい場合 - Qiita
長い前置き 最近はWebアプリケーションを開発するときにサーバ側とクライアント側のプロジェクトを分けて開発することが多い。その理由としては、最終的にはクライアント側のリソースをサーバリソースと一緒にしてデプロイするのだけど、最近はYeomanなどクライアント側の開発プロセスも複雑になってきたので分けたいためである。 サーバはRails、クライアントはYeomanを使ってJavaScriptで開発している。 ログイン認証はRails側でFacebookのOAuthを使用し、セッション情報の保持はCookieを使用している。 Railsはポート3000、クライアントはgrunt serveを使ってポート9000で実行しているのだが、JavaScriptからRailsのREST APIにリクエストを投げたときにOriginが違うのでRailsで作成したCookieが付与されないので、Rails側
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
たった1行！jQueryで指定箇所までアニメーションつきで自動スクロールさせる方法 - Qiita
javascriptで新規タブ/ウィンドウを作成する時の罠 - Qiita
jQueryでURLをパースする - Qiita
