Web Design Articles

  • 1813

そろそろSandyBridgeおじさん卒業。VRがしたくて新しい自作PCを組んだ話

こんにちは、のすけです。=== 去年書いて眠ってたので出しときます。 この記事で作成したPCはもう1年稼働中。いい感じです。 ただ最近はVRはしてませんorz === PCの温度管理は大切!なんて記事を8年前?に書いて、今でも結構みられているのですが。その時のPCが2010年に制作したCore i7 2600K(SandyBridge)を積んだhollywis.hatenablog.comこれです。 今話題?のVRが無性に気になってしまい。こちらの11年前のPCに思い切って GTX 1660 Superを買って強引にくっ付けて、さらに【国内正規品】HTC VIVE Cosmos EliteHTCAmazonVIVEのCOSMOS Eliteなんてのを買って、動くか試しました。 で、結果。 なんと、、、 動いたw 2010年のPCで動くんかいぃ!!すげえな2600K。全然カクツキも感じない。 ただ、一つ問題が。。。 どうやらSandyBridgeってUSB3.0に正式対応してないらしくて ただ、たまたまマザボがUSB3.0を搭載していたから奇跡的にCOSMOS Eliteがうごたわけなんだけど 起動が5回に1回動けばいい方で、結構な割合で起動しないことが多かったんだよね。 原因としては頭につけるガチャピンみたいなヘッドマウントディスプレイとPCを接続するUSB3.0の相性が悪いようだった。 ということで、11年ぶりに思い切ってPCを一新することにした。 構成はこうだ! [構成概要] CPU: Ryzen9 3950x 16コア32スレッド メモリ: TEAM [...]

  • 1862

WSLにRails6環境を構築する方法メモ

Rails6Macでは難なく入ったのですが、、、WindowsのWSLではちょっとてこずったので、現状行ける方法をメモしておきます 【前提】 あらかじめWSLのubuntuが入っているものとします。ない場合はMicrosoftStoreからインスト―ル Ruby: 2.6.3 Rails: 6.0.2.2 Windows10のWSLを使っていきます # VSCodeをインストール VSCodeのリモートがとても便利なので入れていきます。 サイトに行ってダウンロードしてきます Visual Studio Code – コード エディター | Microsoft [...]

  • 1866

container staton docker ubuntu初期設定メモ

いろいろインストール apt update IP系 apt install apt install iproute2 エディタ /etc/init.d/ssh restart ssh apt install openssh-server locale系 apt install language-pack-ja-base [...]

ポテンションメーターを使う | 中華で始める Arduino入門日記11

こんにちは、のすけです。 中華で始める Arduino入門日記の11回目になります。 この連載は、爆安の中華製のArduino互換機を入手し、色々と苦しみながらも安い互換機でArduinoを学習してしまおうというものです。 入手の話はこちらから。 hollywis.hatenablog.com 今回のお題 前回は傾きを検出しました。 hollywis.hatenablog.com 今回は、Potentiometerを利用して傾きを検出してみたいと思います。 チュートリアルのchapter9に対応しています。 早速始めましょう。 ポテンションメーターとは 調整つまみがついたデバイスで、回し具合に応じて様々な抵抗にすることができます。 可変抵抗器ですね。 3つの端子がありますが、両端の2つに基準電圧を掛けて、真ん中の端子で変更された電圧を受けることができます。 回路を作る 両端の端子に5Vの基準電圧をかけます。 そして、真ん中の端子にはアナログのA0ピンを接続します。 このつなぎ方でアナログ値を観測すれば5V(ボルト)で1023、0V(ボルト)で0を記録するはず。 実は付属のブレッドボードにはポテンションメーターの端子のサイズが微妙に合わなくて刺さりませんでした。 そこで、別途持っていたミニブレッドボード(中華キットには入ってません)を使うといい感じに刺さりました。 簡単なんで回路図は省略。 プログラム ポテンションメータ(可変抵抗器)からアナログ値を取得し、シリアルモニタに出すだけです。 前回の傾きより、よほど楽ですね。 int potpin = 0 ; int val = 0 ; void setup() { Serial.begin(9600); } void loop() { delay(50); val = analogRead(potpin); Serial.println(val) ; [...]

傾きを検出してみる | 中華で始める Arduino入門日記10

こんにちは、のすけです。 中華で始める Arduino入門日記の10回目になります。 この連載は、爆安の中華製のArduino互換機を入手し、色々と苦しみながらも安い互換機でArduinoを学習してしまおうというものです。 入手の話はこちらから。 hollywis.hatenablog.com 本題 前回はブザーを鳴らしました。 hollywis.hatenablog.com 今回は、Tilt switchを利用して傾きを検出してみたいと思います。 早速始めましょう。 Tilt switch(ティルトスイッチ)を知る Tilt switch(ティルトスイッチ)またはTilt Sencer(傾斜センサー)とも言い、文字通り傾きを検出するための 電子デバイスです。 身近なところでは、スマホで縦に持つのと、横持つのを検出するのにも利用されているのでは ないでしょうか。 こいつです。 なんかコンデンサみたいな形ですね。 でも、見分けるのは簡単! 振るとカチカチいうのがティルトスイッチです。 どうやって傾きを検出してるの? ググりました。 どうやら御察しの通り、中に入っている金属のボールが関係しているようです。 内部に接点を4つほど用意して、どの接点と金属のボールが接しているかで場合分けをしているようです。 縦に持つと4つ全てに接するけど、横にすると1つまたは2つしか接しない、などなど。 金属ボールの他に、液体を利用するものなど、様々なティルトスイッチの方式がある感じでした。 繋いでみる このティルトスイッチには極性はなさそうです。 回路図はこんな感じです。Fritzingというソフトを使って自作してみました。 使い方は後日別記事で紹介したいと思います。直感的でとても便利でした。 ソフトはこちらからダウンロードできます。 Fritzing Download ブレッドボードの配線図はこちら。 デジタルpin8にLEDと220Ωの抵抗をつけます。 アナログpin5にティルトスイッチをつけます。 実際に刺したのはこちら プログラム 実はサンプルからかなり修正しています。 分かりにくかったのでピンの指定を外だしにしたり、thresholdの設定が 説明と矛盾していたので修正したりしています。 int apin = 5; //アナログpin5を利用 [...]

中華で始める Arduino入門日記9 ブザーを鳴らす

こんにちは、のすけです。 中華で始める Arduino入門日記の9回目です。 この連載は、爆安の中華製のArduino互換機を入手し、色々と苦しみながらも安い互換機でArduinoを学習してしまおうというものです。 入手の話はこちらから。 hollywis.hatenablog.com 本題 中華で始める Arduino入門日記、前回は信号機を作りました。 hollywis.hatenablog.com 今回はついにLEDを卒業して、次なるデバイスである「ブザー」に挑戦です。 ブザーを確認する こちらの丸っぽい黒いのがブザーです。 中華キットにもちゃんと入っていました。 これまでの、Arduinoの動きにも特に問題ありませんし、中華キットいいですね! 利用しているキットに近いやつは⇩ Arduinoをはじめよう 互換キット UNO R3対応互換ボード 初心者専用実験キット 基本部品セット20 in 1出版社/メーカー: vershipメディア: おもちゃ&ホビーこの商品を含むブログを見る ブザーの真ん中に小さな穴が開いています。おそらくここから音が出るのでしょう。 ちなみにブザーというは The buzzer is one integrated electronic transducers, DC voltage supply, widely used in computers, printers, copiers, alarm, electronic toys, automotive electronic equipment, [...]

中華で始める Arduino入門日記8 LEDで信号機を作る

こんにちは、のすけです。 中華で始めるArduino入門 8回目の今回は、信号機を作ります。 この連載は、爆安の中華製のArduino互換機を入手し、色々と苦しみながらも安い互換機でArduinoを学習してしまおうというものです。 入手の話はこちらから。 hollywis.hatenablog.com 本題 前回はLEDをクリスマスツリーっぽく光らせました。 今回はArduino チュートリアルの「Chapter6 Traffic light」になります。 回路 前回のやつから、LEDを半分抜いて、順番を信号機のように赤・黄・緑にします。 そして、利用するピンは10,7,4にそれぞれ接続します。 簡単ですね。 プログラム int ledred=10; int ledyellow=7; int ledgreen=4; void setup() { pinMode(ledred,OUTPUT); pinMode(ledyellow,OUTPUT); pinMode(ledgreen,OUTPUT); } void loop() { digitalWrite(ledred,HIGH); delay(1000); digitalWrite(ledred,LOW); digitalWrite(ledyellow,HIGH); delay(200); digitalWrite(ledyellow,LOW); digitalWrite(ledgreen,HIGH); delay(1000); digitalWrite(ledgreen,LOW); } 特に目新しいことはありませんね。 実際の信号機のように黄色が一瞬だけ光るようにdelay調整しているところにセンスを感じます。 結果 次回はブザーを鳴らします、「Chapter7 Buzzer」の内容に相当します。

中華で始める Arduino入門日記7 LEDをクリスマスツリーっぽく光らせる

のすけです。 中華で始めるシリーズも今回で7回目ですね。 この連載は、爆安の中華製のArduino互換機を入手し、色々と苦しみながらも安い互換機でArduinoを学習してしまおうというものです。 入手の話はこちらから。 hollywis.hatenablog.com 本題 前回はロウソクのようにLEDを付けました。 hollywis.hatenablog.com 今回は、たくさんの色々なLEDをくっ付けてプログラムで制御します。 チュートリアルのチャプター5 Advertising LEDになります。 Arduinoをはじめよう 互換キット UNO R3対応互換ボード 初心者専用実験キット 基本部品セット20 in 1出版社/メーカー: vershipメディア: おもちゃ&ホビーこの商品を含むブログを見る 回路図 *出展:SainSmartチュートリアル よく見えませんが、ArduinoのDigitalピン0~5にそれぞれLEDを付けろという ものになります。 配線例がこちら *出展:SainSmartチュートリアル なんか、複雑ですねぇ。。。 ブレッドボードで作ってみる 配線例が無駄に複雑っぽかったので、簡略化しました。 材料はこちら LED 6個(赤、黄、緑) 抵抗220Ω 6個 ジャンパーコード 7本 配線は次のように繋げます。 ピン0 - 220Ω - LED(緑) - GND ピン1 - 220Ω - [...]

技術ポートフォリオ

なんとなく自分の技術ポートフォリオをまとめてみました重点科目はJS系、その他の言語は重点項目ではないので一旦排除しています。 Lv15までは守 Lv100までは破 Lv100以上は離の領域 総合力: Lv50 (システム開発歴10年ほど) Javascript:Lv35 Nuxt.js : Lv10 Vue.js:Lv15 Firebase総合力:Lv5 Firebase FireStore:Lv15 Firebase Authentication:Lv10 Firebase Storage:Lv5 Firebase Functions:Lv10 Pixi.js,Three.js,babylon.js:Lv5~Lv10 システム開発のチーム連携力 Lv5 サーバー構築 Lv20 システム設計 Lv35 守:ツールを十分に理解するフェーズ 【テーマ】通常の利用方法の範囲で忠実に実行する。2年くらいの利用実績。課題 ・Nuxt.js、Vue.jsのレベルを15まであげる ・Firebaseの総合力をレベルを15まで 破:基本理解が一定レベルを超え、ツールの垣根超えて縦横無尽に利用できるフェーズ 【テーマ】 ツールではなく根源的な法則の理解(基本の積み重ね) ・ほぼ入り口にはいっている。様々なライブラリを取り込み組み合わせて利用できるようになって来た 現在レベル50  →外部のJSライブラリをどんどん取り入れ、Lv15まで理解し、その後複合させて独自のシステムに昇華させるフェーズ 勉強: 破レベルの先輩コードに触れ学ぶ! TODO:   ティラノスクリプトのソースコードを読む   Pixi.jsのソースコードを読む   Three.jsのソースコードを読む   普段使ってるOSSで不満に思ったことを書き留めておく 離:独自のフレームワークを生み出すレベル 【テーマ】 融通無碍の境地。基本を全て押さえ、組み合わせもでき かつムリなくシンプルに纏める、納める事ができる技術 2・6・2 『自己満曲線』に入ってないか定期的にチェックする。 ・リリース →体感としてLv70くらいを目指していた。 ・フォーカス [...]

nuxt.js のSSRデバッグ方法 by Jetbrain

こちらの記事が参考になりました。 ありがとうございます。k-sasaki.net asyncDataのデバッグを諦めてconsole.logで頑張っていたところこれで、デバッグできるようになりました!こんな感じで、ブレークポイントを入れたい場所に「debugger;」と書けばchromeのDevツールでブレークされます。Jetbrain最高です。

Let’s Work Together

Tell me more about your project

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.