メサイア・ワークス | 本とか料理とかコンピュータとか

firebase(googleのサーバレス)で、リアルタイムチャットのサンプルがあったので実装してみた。

2020年5月19日に admin が投稿

firebase(googleのサーバレス)で、リアルタイムチャットのサンプルがあったので実装してみた。こういうのは有料動画だよね～。 https://dotinstall.com/lessons/basic_fire 続きを読む firebase(googleのサーバレス)で、リアルタイムチャットのサンプルがあったので実装してみた。→

JSが急に分かりづらくなった理由(ES6以降とNode.js、それ以前の話)

2020年5月19日に admin が投稿

JSが急に分かりづらくなった理由(ES6以降とNode.js、それ以前の話) 参考URL https://qiita.com/naoki_mochizuki/items/cc6ef57d35ba6a69117f 1, j 続きを読む JSが急に分かりづらくなった理由(ES6以降とNode.js、それ以前の話)→

ブラウザに100*100pxの四角を表示して、クリックする度に色がランダムに変わるサンプル。こうやってJS/CSSを組み合わせるとフロントエンド感ある。

2020年5月19日に admin が投稿

ブラウザに100*100pxの四角を表示して、クリックする度に色がランダムに変わるサンプル。こうやってJS/CSSを組み合わせるとフロントエンド感ある。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>js test</title>
  <style>
    .box{
      width: 100px;
      height: 100px;
      background-color: skyblue;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div class="color" id="color">skyblue</div>
  <div class="box" id="target"></div>
  <script>
    'use script';
    function changeColor(){
      // #000000-#ffffffをランダムで出力
      var randomColor = "#" + ('000000' + Math.floor(Math.random() * (2**24)).toString(16)).slice(-6);
      // 文字列と色で表示する。
      document.getElementById('color').textContent= randomColor;
      document.getElementById('target').style.background = randomColor;
      //document.getElementById('target').style.borderRadius = '50%';
    }
    // 最初にランダムな色を設定
    window.addEventListener('load', changeColor, false);
    // クリックされた時もランダムな色を設定
    document.getElementById('target').addEventListener('click', () => {changeColor(); });

  </script>
</body>
</html>

<!DOCTYPE html>

<head>

<style>

.box{

width: 100px;

height: 100px;

background-color: skyblue;

cursor: pointer;

}

</style>

</head>

<body>

<div class="color" id="color">skyblue</div>

'use script';

function changeColor(){

// #000000-#ffffffをランダムで出力

var randomColor = "#" + ('000000' + Math.floor(Math.random() * (2**24)).toString(16)).slice(-6);

// 文字列と色で表示する。

document.getElementById('color').textContent= randomColor;

document.getElementById('target').style.background = randomColor;

//document.getElementById('target').style.borderRadius = '50%';

}

// 最初にランダムな色を設定

window.addEventListener('load', changeColor, false);

// クリックされた時もランダムな色を設定

document.getElementById('target').addEventListener('click', () => {changeColor(); });

</script>

</body>

</html>

ドットインストールの自動再生用chrome拡張を作った。「楽をするための苦労は勝手にする！」ってのが、プログラマという人種だよな〜。

2020年5月15日に admin が投稿

ドットインストールの自動再生用chrome拡張を作った。「楽をするための苦労は勝手にする！」ってのが、プログラマという人種だよな〜。ドットインストールの動画が２〜３分しかないのに毎回再生ボタンを押させるので、自動再生は続きを読むドットインストールの自動再生用chrome拡張を作った。「楽をするための苦労は勝手にする！」ってのが、プログラマという人種だよな〜。→

css3のflexboxを使うと、ヘッダ・フッタ・３カラムが簡単に実装出来る。ドットインストールの有料動画(一ヶ月1080円)が分かりやすかったので課金！

2020年5月14日に admin が投稿

css3のflexboxを使うと、ヘッダ・フッタ・３カラムが簡単に実装出来る。ドットインストールの有料動画(一ヶ月1080円)が分かりやすかったので課金！ https://dotinstall.com/lessons/b 続きを読む css3のflexboxを使うと、ヘッダ・フッタ・３カラムが簡単に実装出来る。ドットインストールの有料動画(一ヶ月1080円)が分かりやすかったので課金！→