はじめに データの並び順を自由自在に入れ替えたい、という要求があったとき、ドラッグアンドドロップで順番が変えられるとなかなか便利です。 そこで本記事ではドラッグアンドドロップによる表示順変更機能をRails 4で実装する手順を説明します。 補足資料 理解しやすくするための補足資料をいろいろ用意してみました。 デモサイト Herokuにデモサイトを作ってみました。 元々のサンプルアプリケーションはCRUDができるようになっていますが、このデモサイトではデータの更新はできません。(変更できるのは順番のみ) ドラッグアンドドロップするとどうなるか、実際に動かしてみてください。 サンプルアプリケーションを作る過程を録画してみました。 フルスクラッチでrails newするところから始めています。 http://www.youtube.com/watch?v=YQ-6HkBhVyc&feature=

2018.11.20 民事訴訟の訴状を提出し正式に受理されました。弊社が数年間にわたり何百万円ものお金を不正に取られていた件について。 弊社が数年間にわたり何百万円ものお金を不正に取られていた件について。民事訴訟の訴状を提出し正式に受理されました。本件は民事だけではなく刑事も法的手続きを進めました。しかし、刑事については申し訳ございませんが捜査の関係上詳しいことが現時点ではこれ以上書くことができません。 本来、このような犯罪の疑いが濃い事実に関しては、被告の社会的名誉に配慮して、捜査がある程度のめどがつくまでは公表を控える予定でした。また、今回の件は相手側が原告として弊社に民事訴訟を提訴しております。相手側が民事裁判の提訴をした以上、このような事実は裁判の手続きに従って、証拠として裁判所に提出するつもりでした。 しかし、原告側は虚偽の内容を記者会見およびマスコミ、インターネットで流布してい

下記抗議文を先週送付したことを公開致します。 冠省 弁護士ドットコム　社長様 弁護士ドットコムニュース編集責任者様 弊社と業務委託契約を結んでいた女性の遺族、元委託契約先二名（以下『原告』と略）が民事訴訟を弊社に起こし、記者会見した旨の記事（以下『本記事』と略）が「『死んだほうがましですか』壮絶パワハラで女性自殺　『現代版の奴隷制度』で社長提訴」との見出しで 2018年10月17日付御社ウエブに掲載されました。 （A)https://www.bengo4.com/c_5/n_8706/ しかし本記事は、原告側の述べた虚偽の内容をあたかも真実であるかのように見出し・本文・写真そのほかとも記述し、総体として読者を誤認に導く、極めて遺憾な内容と言わざるをえません。 （１）民事訴訟の提訴段階での原告の主張および訴状内容は、事実の裏付けがない一方的な「主観」にすぎません。法廷での手続きが進行するなか

四暗翁@すーあんおー(31) @mask_okina Q.ぬいぐるみペニスショックって何？ A.「(私は)恋愛感情なしに仲の良かった男性が突然告白してきたので、まるでぬいぐるみから唐突にペニスが生えてきたような気持ち」ってやつ。 2018-11-20 23:52:52 四暗翁@すーあんおー(31) @mask_okina まあ人生そういうこともありますが、気落ちせずに男性諸氏は頑張っていきましょう。相手のことはよく観察するんだよ。ちんちんの言うことばかり聞いていてはいけないぞ。 こればっかりは経験がモノを言うので、失敗しても諦めてはいけない。いやほんと。マジでな。 2018-11-20 23:55:14 四暗翁@すーあんおー(31) @mask_okina ぬいペニショック(って書くと不知火からペニスみたいだな)が起こる原因ってのはたいがい「告白がただの確認作業であることを理解していない」

本当の話なんだが俺は肛門で多少喋ることができる。 口で話すほど流暢にはできないがシンプルな会話ならできると思う。 もともとはおならをした後の残屁感というか、ちょっと残ってる感が気になり、完全に出し切る方法を探していた。 いろいろ試す過程で裸になって仰向けになって脚を広げ腰を浮かすと肛門を自在にガバッと開閉できることに気がついた。 そこから出し切ることに専念したのだが、 ある時閉めると同時に大量の空気を吸い込んでしまった。 この体験から空気を自在に出し入れできるようになった。まさに肛門呼吸といってもいいだろう。 この肛門呼吸になれたあたりからだんだん自在に好きな音の屁を出せるようになってきた。 ただし常時できるわけではなく。裸で両足を広げて腰を浮かせた時だけである。 この肛門の練習を毎日寝る前にやっていたのだが、2年目ぐらいだっただろうか偶然声のような音を出すことができた。 この瞬間から肛門

前回の記事で少し使いましたが .html() の書き換えです。 id は「1つしか無い」、class は「複数ある」です。HTML上にその class が仮に1個しかなかったとしても「複数ある」として考えます。JavaScript では「1つしか無い」と「複数ある」は全く操作が違います。「複数ある」場合は for で総当りします。tag 名で取得したりする場合は前回の記事を参考にして書き換えてみてください。 for についての詳細は前回の記事を御覧ください。 参考：forについて jQuery（id の場合） $("#id").html("<span>テスト</span>"); 書き換え JavaScript（id の場合） document.getElementById("id").innerHTML = "<span>テスト</span>"; .html("○○") を .innerH

脱jQuery その2です。 今回は「複数ある」場合の $() の書き換えになります。JavaScript では「1つしかない」と「複数ある」は操作がだいぶ違います。 詳しくは、脱jQuery その1の記事を御覧ください。簡単な注意事項等書いています。 $(".class") HTML <div class="class">こんにちは</div> <div class="class">こんにちは</div> これらの .class の ”こんにちは” の文章を ”こんばんは” に入れ替えます。 $(".class").html("こんばんは"); 書き換え JavaScript var myClass = document.getElementsByClassName("class"); for (var i = 0; i < myClass.length; i++) { myClass[

脱jQuery その1 です。 本日より25日間連続で「脱jQuery」についての記事を「アドベントカレンダー」に投稿していきます。つたない文章力ですが、わかりやすく書くよう頑張りますのでよろしくお願いします。 方針本題の前に方針を少し。 jQuery の利用を否定するものではありません。 正確に jQuery ⇒ JavaScript を書き換えることよりも、「わかりやすく書き換える」に主眼を置きます。 間違った書き換えを行うというのではなく、jQuery オブジェクトと JavaScript の通常のオブジェクトの違いまでは考慮しないといった感じになります。 「jQuery のように JavaScript を扱う」を主眼においてなるべく JavaScript 独特な表現は避け、コピペでも使えちゃうよ、ぐらいの勢いで書いていきます。「jQuery は書けるのに JavaScript は書

属性値を取得したり変更したり出来る .attr() のネイティブ書き換えです。これまでにも何度か書き換えの記事で既に登場してるので再登場となります。 詳しくは 脱jQuery その1 を御覧ください。 .attr()（属性を取得） $("#myimage").attr("src")書き換え JavaScriptdocument.getElementById("myimage").getAttribute("src")attribute の省略版が attr ということになります。使い方は単純で getAttribute() のカッコ内に取得したい属性値を入れることで取得できます。 JavaScript の属性取得には別の方法を使える属性もあり、そちらのほうがメジャーなのですが、その方法は取得できない属性もあります。全て属性値を万能に取得できる方法は上記の方法となります。 他の方法も知りたい

id:eitoball です。秋ですね。読書の秋といいますが、先日、「われはレギオン」のわれらはレギオン 3: 太陽系最終大戦 (ハヤカワ文庫ＳＦ)を読み終えました。物語のテンポがよく、気持ちよく読むことができました。Sci-Fi小説が好きな方には特にお勧めします。（われらはレギオン1 AI探査機集合体 (ハヤカワ文庫SF) とわれらはレギオン２　アザーズとの遭遇 (ハヤカワ文庫SF) もあわせてお勧めします。） 先日、会社で同僚の何人かと一緒にDHHのAction Textを紹介するYouTube動画を見ました。（ Alpha preview: Action Text for Rails 6 ）見るだけではつまらないので実際に試したいと思います。 Action Text とは？ Action Text とは、Rails 6.0 で予定されている新機能の1つです。リッチテキストを編集・表示

[レベル: 中級] 昨日とおとといに続いて、今日も Chrome Dev Summit 2018 のセッションレポートをお届けします。 セッションのタイトルは “Speed Essentials: Key Techniques for Fast Websites” です。 昨日レポートしたセッションと同じようにモバイルウェブの高速化がテーマです。 しかし、こちらはより実践的な内容になっています。 パフォーマンス改善に非常に役立つテクニックが満載です。 パフォーマンス改善の優先対象は画像とJS、フォントの3つ モバイルウェブで 1 ページあたりデータ量が多いリソースは次の順番（HTTP Archive 調べ） 画像 (約 500 KB) JavaScript (約 380 KB) フォント (約 80 KB) この 3 つは Performance Budget（パフォーマンス バジェット）

１９日夕刻、「東京地検特捜部は、日産自動車のカルロス・ゴーン会長を逮捕へ」というネットニュースを見て目を疑った。倒産寸前だった日産をＶ字回復させるなど、経営者としての手腕を高く評価され、今や、日産のほか、三菱自動車、フランスのルノーという３社の会長を務めるゴーン氏を日本の検察当局が逮捕するとは驚きだ。しかも、記事によると、容疑事実は「役員報酬を過少申告した有価証券報告書の虚偽記載」とされている。大企業であれば、有価証券報告書は、総務などの担当部門で情報を集約して作成・提出する。その有価証券報告書での役員報酬が過少に記載されていたのであれば、会社の組織の問題だ。何が問題なのか、さっぱりわからなかった。 その後、ゴーン氏が、グレッグ・ケリー代表取締役とともに逮捕されたことが報じられ、容疑事実が「ゴーン会長に対する報酬額を実際の額よりも少なく有価証券報告書に記載した金融商品取引法違反（有価証券報

こんにちは、id:hitode909です。今回は、id:onkに話を聞いてみます。 onkさんとはここ半年ほど隣の席に座っていて、マンガチームでの課題を足がかりに、CTO室の時間を使って全社的な問題を解決しようと日々活動しています。 id:onkにアンケート はてなidとその由来を教えてください いつどんなきっかけで入社されましたか? 現在の仕事を教えてください チーム内の立ち位置を教えてください 今日一日の流れを教えてください 最近うまくいったことは何ですか? 最近うまくいってないことは何ですか? ふだん大切にしていることは何ですか? はてなはどんな会社ですか? おわりに id:onkにアンケート はてなidとその由来を教えてください 苗字の大仲 (ONaKa) からです。2004-2005 年ぐらいに取得したはず。当時は (今も？) 母音を省略するのがカッコイイという雰囲気があったと思

Trying to cram all that complexity in one developer’s head (especially for someone who is just starting out) results in a well-described cognitive fatigue. However, the feeling of being left behind the pack, the growing difficulty to talk shop with “frontend guys”, and the creeping anxiety about job prospects should not be your only reason to question an established workflow. Programmers are ratio

Ruby on Rails の 5.1.0.beta1がリリースされましたね！ weblog.rubyonrails.org 仕事でRailsを使うものとしてちゃんと触っておかねばと思い、まずは自分の好きなJavaScript周りがどれぐらい良くなったのか見てみたところかなりびっくりしました。JavaScriptすごく開発しやすいです。 webpack があって yarn がありますし、ReactやVue、angular まで rake タスクでセットアップできます。ちょっと前までRailsでJavaScriptやるのが辛いなんて言っていたのが嘘みたいです・・・。 今回はRails 5.1.0 で Vue.js を使って新しくプロジェクトを作るところまでやってみました。 rails new rails webpacker:install:vue Webpackでのビルド Hot Modul

ども、@kimihom です。 Rails の Sprockets や Uglifier などが最新の JavaScript に追従していないという理由で、Rails 標準のやり方から外れて最新のフロントエンドツールを追い求める系の報告が多い。一部では完全に Rails の Asset Pipeline から外れて、Gulp などに移行する話もよく聞く。確かに現行の Rails のフロントエンド環境で開発すると、let や クラス構文をまともに使えない(エラーになる)ため、最新の構文に対応した JavaScript フレームワークはほとんど使えないのは大きな問題として残り続けている。 最新版である Rails 5.1 から、ようやく jQuery からの脱却とフロントエンド周りの最新化、つまり Yarn や Webpack の導入が検討され始めている。これに期待されている方も多いのではない

スタイルシートでa要素のリンクのデザインをする際に、次のように 4 つの擬似クラスを用いることが多いと思います。 a:link { color: blue; } a:visited { color: purple; } a:hover { color: red; } a:active { color: yellow; } 実はこの 4 つの擬似クラスの記述順序には注意が必要で、 link visited hover active の順番で記述しないと意図した結果にならなかったりします。この順序についてちょっと調べてみたので、まとめてみたいと思います。 なぜこの順番じゃなければダメなのか？ 実践 Web Standards Design には、次のように書かれています。 :hover 擬似クラスと:active 擬似クラスは一連の動作であるので、スタイルシート内でもこの順番で記述しないと有効

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

【経緯】 別プロジェクトで作った機能を一部スピンオフして一つのアプリケーションにしたいと言う要望があったため、アプリケーションを別リポジトリにpushすることとなりました。 【準備】 取り込み元 https://github.com/moto/torikomi_moto.git 取り込み先 https://github.com/saki/torikomi_saki.git 【実際のコマンド】 1: $ git clone https://github.com/saki/torikomi_saki.git 2: $ cd torikomi_saki 3: $ git remote add torikomi_repo https://github.com/moto/torikomi_moto.git 4: $ git pull torikomi_repo master 5: $ git add

秋田市の大森山動物園は今現在注目すべき見所が４つあるんだけどその紹介をしたかったんだけれども最初に言いますがゾウは陰茎も長い。 アフリカゾウのだいすけは長年「花子」と一緒でしたがちっとも交尾しないので同じような状態の八木山動物園の「リリー」と「花子」を交換することになりそのリリーを見に行ったんですよ（みどころその1）。「リリー」は地方ニュースでは「小顔で足が長い」だとかべた褒めで着いたその日からだいすけは興味津々ぽかった。 実際この日も外で干し草を食べていただいすけが 急にちょっと「リリー」に持って行ったりして リリー。 だいすけ。このじてんで微妙に陰茎が膨らんでいる。 で、その後 うんこしたら なんかとても長い。生理現象なのか。 以前もだいすけのこういうのを見たことがあるのですが確か朝イチで排泄後でした。今回はだいすけのこういう雄姿？を画像に残せてよかったです！！ あと３つの見所をダイレ

ふるまいやセキュリティ意識など技術以外も磨け！N高講師が教えるプロエンジニアに必要な要素 この春から「プロのエンジニア」として働き出す方々に知ってほしい「技術以外の心掛け」を、N予備校プログラミングコースのプログラミング講師＆全教材を制作する吉村総一郎さんに教えてもらいました。 大学や専門学校などを卒業し、この春から「プロのエンジニア」として働きだす方々も多いかと思います。プロのエンジニアとして「技術」をしっかり習得し、磨くことはもちろん大切ですが、いざ組織やチームで働きだすと、同じくらい重要視されるのが「技術以外の部分」です。 今回は、はてなブックマークやブログなどで大きな反響を集めている「N予備校 プログラミングコース」のプログラミング講師を務め、全ての教材の制作を行った吉村総一郎さんに「これからプロとして働く若手エンジニアに伝えたい技術以外の重要なこと」をまとめていただきました。 は

「日本人に管理されている」 来日を後悔？「とんでもない」 もし、あなただったら？ この10月、全世界で30万人を雇う日本有数のグローバル企業、日立製作所から解雇通告を受けたフィリピン人技能実習生が、労働組合に入って団体交渉に打って出ました。賃金補償の獲得が第一の目的でしたが、背景には実習内容への強い不満がありました。この数カ月、多くの実習生を取材してきて感じたのは、厳しい生活の中でも、なんとか明るく過ごそうとするたくましさでした。（朝日新聞名古屋報道センター記者・前川浩之） 「日本人に管理されている」 団交に訴えて出たのは、新幹線や英国の高速鉄道車両などを作る日立の笠戸事業所（山口県下松市）で働く実習生たちです。工場には約270人のフィリピン人実習生がいて、全従業員約1800人の約15％を占めています。 途上国の若者に日本の技術を伝えようというのが「技能実習制度」ですが、人手不足の業界を支

娘を強姦殺人で失った父親が、無罪となった犯人への「復讐」を誓い、周到な準備の末に猟銃で射殺する。その後、父親は自首して逮捕されるが、裁判員裁判により「懲役3年、執行猶予5年」の判決を受けた――。これは、現実に起きた話ではなく、2月7日にテレビ朝日系で放送されたスペシャルドラマ「復讐法廷」の中の出来事だ。 あらすじは次のようなものだ。主人公の愛娘を強姦した上に殺害した犯人は逮捕されるものの、裁判で無罪判決が言い渡されてしまう。証拠となった自白が、取り調べ中の警察の暴力で無理やりに引き出されたと認定され、公判が維持できなくなったためだ。そこで「正義の鉄槌」を下すべく、田村正和演じる父親が、無罪放免となった犯人に仇討ちをするというストーリーだ。 最後に父親が受けたのは「懲役3年、執行猶予5年」という判決。これが確定すれば、刑務所に行かずに済むことを意味する。ドラマの視聴者にとっては、納得の展開か