【React】Functional ComponentとClass Componentの違い

Reactコンポーネントには大きく分けて2つのコンポーネントがある。それFunctional ComponentとClass Component。

Functional Component

const Hello = (props) => { return <div>こんにちは、{props.name}さん</div>}

Class Component

class Hello extend

もっとみる

React+Reduxで作ったtodoアプリのフローを理解する

以下のtodoアプリを写経して作ってみたので、その作りをデータフローを見ながら理解する。
https://codesandbox.io/s/github/reduxjs/redux/tree/master/examples/todos

Action

actionオブジェクトは「何をする」という情報を持ったオブジェクト。actionオブジェクトがdispatch(送信)されることでstoreに送

もっとみる

NuxtでESLintとPrettierを使うときの設定

VSCodeでNuxtのプロジェクトを立ち上げるとき、ESLintとPrettierの設定がいまいち分かってなかったので整理してみる。

前提

・エディタにはVSCodeを使う。
・`npx create-nuxt-app`で立ち上げたとき、ESlintとPrettierをそれぞれインストールする。

.eslintrc.js

こちらはデフォルトの設定。
`rules`の部分に除外したいルール

もっとみる
ありがとうございます。ここには35文字しか書けないのですが、本当はまだ

【リリースノート】 集計ページの円グラフが降順で表示されるようになりました

Owntimeはこちら

リリース内容

集計ページに表示される円グラフのデータが、費やした時間の割合が高い順に並び替えられるようになりました。

月ごとに自分がどんなことに、何%の時間を使っているかが可視化されることによって、生活改善につなげるヒントを見つけることができるでしょう🕰

所感

Owntimeを運用しているCraggsのTwitterアカウントのフォロワーが少しずつ増えてきていて

もっとみる

Alexa スキルアワード ハッカソンに出場して、たった2日で初めてのJavascriptを使用してスキルを作成した人の話

少し前になりますが、6月下旬にAmazon Alexa スキルアワードハッカソンに出場しました。

Alexa 知っていますか?

Amazonが出しているスマートスピーカーです

経緯

私は昨年からスキル開発を行っており、いつもpythonで作成をしていました。私はコードがさほど書けません(セキュリティエンジニアのため、普段はコードを書くことはありません。いつもネットワークなどです)。趣味程度

もっとみる

1回目以上の盛り上がり!仙台で v-sendai meetup #2を開催しました

v-sendai運営の @kan_dai です。
先日の7月1日に、仙台で2回目のVue.jsのミートアップイベントを開催することができました。人数、盛り上がりも前回以上の当日のレポートです。

開催準備

そもそもなんで仙台でVue.jsのコミュニティやってんの?っていう話はぜひ前回のレポート記事を読んでみてください。
ありがたいことに、前回はたくさんの申し込みで定員割れしてしまったので、今回は

もっとみる

名前空間について

名前空間(パッケージ)とは、クラスをまとめる箱のようなもの。
名前空間を定義することで、同じアプリケーション内でクラス名どうしで競合する危険性を減らす。

javaScriptでは空のオブジェクトを利用して擬似的に名前空間のようなものを作る。以下のように。

名前空間の定義

const Wings = Wings || {}// Wingsが未定義の場合にのみ、新たな名前空間を作る。// `Wi

もっとみる

JavaとJavaScriptは違うよ

Web業界・IT業界でも、よく新人の営業マンやディレクター陣もこの違いを知らない。というか同じもの、あるいは兄弟や親子みたく勘違いしている人がまだまだいる。

潔く、違うって事だけ覚えよう!

じゃ何が違うのですか?っていう前にそもそも違うぞって事だけ理解してもらいたい。同じです!って言い切らなければOK。

これだけ違うよ!っていういい例えをしているサイトを発見したのでご紹介します。

・インド

もっとみる

JavaScriptを使ってGenerative Artを作成:02

こんにちはKAORIです。
generativeアート作成の続きを書いていきたいと思います。
その後、いろいろと調べたり復習したり写経なども続けています。

今回は、前回の続きで次々に表示させていきながら教わったコードなどをお話させていきたいと思います。

次に表示したのはこの画像になります。
どんな風に色を出すのか、どんな数字を出すとどの色になるのかの確認紹介になります。

<!DOCTYPE

もっとみる

ES2019にはいった新機能各位を試してみるマン

やっほ〜めろたんだよ〜
最近は会社内でラグマス部ができてしまったので僕はAgi/Lukのクリアサしてるよ〜
Str振ってなかったからゴミみたいなダメージしか入らなくって泣いてるよ〜

ヘッダーの画像は内容と一切関係ないカラテ王だよ。

たまにはテックなことも書かないとな〜と思ってたらちょうど?ES2019の正式リリースがあったようだったので、それにはいった新機能とかを触ってみようかな〜とおもった次

もっとみる