Macrovector - jp.freepik.com によって作成された design ベクトル 目次 事前に 概要 Sprocketsを除外したアプリケーション Sprocketsの除外方法 1. 事前に 今回、作成したアプリケーションは以下のバージョンのrubyとrailsを事前にインストールしています…

目次 Hash#transform_keysを利用する 変更前 変更後 まとめ 1. Hash#transform_keysを利用する 先日行った知床峠の写真です。本記事とは無関係です。 久しぶりにRuby on Rails APIモードのアプリを確認していたら、rubocop さんからの警告が表示されていまし…

目次 初めに 原因 対応方法 変更前 変更後 追記 1. 初めに Next.js + Material-UI(styled-components)を使ってリロードしたときに、以下のエラーが発生してスタイルが崩れました。 Warning: Prop `className` did not match. 2. 原因 サーバーサイドで新しく…

Vue.jsによって、生成されたDOMの結果を確認する。 <template> <div class="sample"> <p>sample</p> </div> </template> <script> export default { name: "Sample" } </script> <style scoped> .sample { text-align: center; } </style> // tests/unit/components/Sample.spec.js import { shallowMount …

Reactによって、生成されたDOMの結果を確認する。 /* App.css */ .App { text-align: center; } // App.js import "./App.css"; const App = () => ( <div className="App"> <p>sample</p> </div> ); export default App; // App.test.js import { render, screen } from "@testing-library/rea…

ダック・タイピングとは If it walks like a duck and quacks like a duck, it must be a duck. （もしも、それがアヒルのように歩き、アヒルのように鳴くのなら、それはアヒルに違いない。） デーブ・トーマスより ダック・タイピングは、オブジェクトに何…

JavaScriptの勉強 最近、JavaScriptを中心に勉強しています。業務ではVue.jsを使っていますが、Reactにも興味があり少しずつコードを書き始めました。ReactはSimple、Vue.jsはEasyと言われておりますが、その意味も理解できるようになってきました。私は下記…

Vue.jsのガイドでfunctionを使っている部分を見つけたので直感でArrow Functionの記法を使ってみましたが、正常に動きませんでした。 引用元: はじめに — Vue.js // functionありの記法 const app = new Vue({ el: "#app", data: { message: "Hello Vue.js!"…