bkc

ブログです。JavaScriptはわからない派です。goと友達になるのはまだまだ先のよ…

bkc

ブログです。JavaScriptはわからない派です。goと友達になるのはまだまだ先のようです。 https://bkc-home.vercel.app/

  • プログラミング

    プログラミング関係のことをまとめます。

  • 学び

    学ぶことそのものについて

  • 高校数学

    高校数学に関するtips的なもの。

  • 数楽

    数を楽しむためのいろいろをまとめます。

Zennなどを初めてみたり

Zennを始めました。 これから技術関係はZennで書いていこうと思います。こちらでも日記的なものは書いていこうと思います。 追記 最近キャンプを始めようとしています。一緒に行ってくれる友達がいないのでもちろんソロキャンです。

bkc

    • goのウェブ関係を学ぼう(静的ファイルを扱う)

      ４連休でgoのウェブ関係の基本的なことを学んでいきました。しかし４連休では時間が足りずクライアントに文字列を返す程度でしたが、それだと大したことはできないので、今回からもう少し掘り下げていこうと思います。 前回までと同様参考サイトは以下になります。参考サイトだとフォームの項からになります。 今回は、フォームに入る前に簡単にhtmlやcss, javascript, 画像などの静的ファイルをどのようにホスティングするかをまとめていこうと思います。参考サイトには載っていないと

      bkc

      • reactでp5jsも使ってさらにリアルタイムデータベースも使いたい３

        今回はfirebaseを入れて以下のようにWebを通じて同期させてみたいと思います。同じ時間に利用している全ての人の操作が全ての人の画面に反映される訳です。 firebaseの設定以下のコマンドでfirebaseをインストールします。 $ yarn add firebase firebase.js firebaseConfigの値は.envファイルで別に定義してください。またhosting先でも設定するようにしてください。 import firebase from

        bkc

        • reactでp5jsも使ってさらにリアルタイムデータベースも使いたい2

          前回画面の実装が済みました。firebaseの導入に向けて今回は前回のものに修正を加えます。 ディレクトリの配置変え前回はsrcディレクトリ直下に全て置いていたのですが、ファイル数が多くなりそうなので少し整理します。以下のようにディレクトリを作成しjsファイルとcssファイルを分けます。また前回無かったファイルもありますが、あとで使用するものです。 ライトモードとダークモードの導入switch.js 明るい状態は前回のスクリーンショットで見てもらったかと思いますが、暗い

          bkc

        Zennなどを初めてみたり

        bkc

        • goのウェブ関係を学ぼう(静的ファイルを扱う)

          bkc

        • reactでp5jsも使ってさらにリアルタイムデータベースも使いたい３

          bkc

        • reactでp5jsも使ってさらにリアルタイムデータベースも使いたい2

          bkc

        マガジン

        • プログラミング
          59本
        • 学び
          5本
        • 高校数学
          4本
        • 数楽
          1本

        記事

          reactでp5jsも使ってさらにリアルタイムデータベースも使いたい１

          p5jsは結構前から使っていましたが、ジェネラティブアートとかクリエイティブコーディングとかその手の類の画像や動画を生成して満足していました。そんでもうちょい進歩したことしたいなと思い今回はreact上でp5jsが出来るようにし、可能ならばリアルタイムデータベースを使ってインタラクティブなサイトを作りたいなと思いました。 とはいえ、すでにreactとp5jsに関してもいろいろなライブラリが出ているのでそれを組み合わせるだけだと思います。早速やっていきましょう。 環境構築環

          bkc

          reactでp5jsも使ってさらにリアルタイムデータベースも使いたい１

          bkc

          ４連休でgoのウェブ関係を学ぼう(ServeMuxてなんぞや？)

          前回はソースコードを追っていってなかなか骨の折れる作業でした。今回はGoのhttpパッケージの大事な概念であるServeMuxについて見ていきます。前回の最後の方でいきなりDefaultServeMuxなんて出てきてびっくりしたかもしれませんが今回そこを解決できればと思います。今回も例に漏れず参考サイトは以下になります。 あと必要に応じて公式のドキュメントやソースコードを引っ張ってきます。 ServeMuxを詳しく見てみる// ServeMux is an HTTP re

          bkc

          ４連休でgoのウェブ関係を学ぼう(ServeMuxてなんぞや？)

          bkc

          ４連休でgoのウェブ関係を学ぼう(goでどのようにWebサーバを実現するか)

          前回まででWebでのクライアントとサーバのやりとりの仕組みはわかったと思います。 今回は特にサーバの方でクライアントからリクエストが来た時どのようにして処理をしているか、またGoではそれをどのようにして実現しているかをみていきましょう。今回も以下を参考にします。 正直Webの仕組みが曖昧な中でコードを追っていくのはとても大変でした。参考サイトでは細かいところは端折ってコンパクトにまとめてあるので、それを補足するつもりで書きました。ただ量が多くなったと思うので読む方を今回は

          bkc

          ４連休でgoのウェブ関係を学ぼう(goでどのようにWebサーバを実現するか)

          bkc

          ４連休でgoのウェブ関係を学ぼう(Web基礎編)

          前回Goのローカル環境構築について書いてきました。 参考サイトはいかになります。 今回も参考サイトに倣ってWebの基礎を復習しようと思います。高校の情報の授業を習った人なら授業の内容を少し詳しくした程度ですが、故に疎かにしがちなところでもあるのでここでもう一度復習をしましょう。 ちなみにGoの基礎文法には触れません。参考サイトには丁寧に書いてあるのでGoの文法について興味がある方は、参考サイトを参照してください。 HTTP通信の流れまずはブラウザとWebサーバがどのよ

          bkc

          ４連休でgoのウェブ関係を学ぼう(Web基礎編)

          bkc

          ４連休でgoのウェブ関係を学ぼう(開発環境構築編)

          こんなツイートを見かけたので４連休を使ってgoのウェブ関係をしっかり学んでまとめたいと思います。ただし、土曜日は４連休に含めないこととする。 それでとても良いサイトを見つけたのでそのサイトを参考にまとめていこうと思います。 筆者の実行環境 macOS Catalina go version go1.14.7 darwin/amd64 エディタ: vscode ワーキングディレクトリこれまでTour of Goやplaygroundでしかコードを書いてこなかったのでロー

          bkc

          ４連休でgoのウェブ関係を学ぼう(開発環境構築編)

          bkc

          Exercise: Web Crawler

          とうとうA Tour Of Go最後のエクササイズになりました。 内容In this exercise you'll use Go's concurrency features to parallelize a web crawler. Modify the Crawl function to fetch URLs in parallel without fetching the same URL twice. Hint: you can keep a cache of t

          bkc

          Exercise: Web Crawler

          bkc

          Go Exercise: Equivalent Binary Treesへの挑戦　その２

          前回の続きです。 並行処理、チャンネルは使わずに実装してみるfunc walk(t *tree.Tree, n int) { n++ // 左から探索 if t.Left != nil { tl := t.Left // 孫が存在すればさらに探索 if tl.Left != nil || tl.Right != nil { walk(tl, n) } else { // そうでないなら値を表示 fmt.Println("左　深さ:", n+1, "値",

          bkc

          Go Exercise: Equivalent Binary Treesへの挑戦　その２

          bkc

          Go Exercise: Equivalent Binary Treesへの挑戦　その１

          やっとというか、とうとうというか、ここまできました。ラスト二つのエクササイズです。ラスト二つはGoの並行処理を利用した問題になっています。ゴルーチンてやつですね。正直ゴルーチンの概念を理解するのにもかなり時間がかかったので、このエクササイズを解くのも時間がかかると思います。なので何回かに分けて残そうかなと思います。 問題の整理英語のサイトをときには翻訳機を使い、ときには他の人が解説しているサイトをのぞき(もちろん答えまでは見てません。)でやっているので問題を理解するまでで一

          bkc

          Go Exercise: Equivalent Binary Treesへの挑戦　その１

          bkc

          SVG使うと素人でもデザインの幅が広がるよーって話

          海外のお洒落なサイトとかみてると波線があったり、少し複雑な形のアイコンが浮かんでたり動いたり変形したり、普通png画像だと難しそうだしcssで書くのは記述量がめちゃくちゃ多くなりそう(ていうかcssでそんな複雑な形描けねーよ)。 で、どうやらSVGという拡張子の画像を使用してデザインしているようです。このSVG使ってみたら素人の知識でも色々出来そうで、学習コストもそこまで高くなさそうなので紹介したいと思います。ちなみにSVGを使うと素人でもhtmlとcssだけでここまで出来

          bkc

          SVG使うと素人でもデザインの幅が広がるよーって話

          bkc

          ビートとか作ってみたり

          プログラミング始める前からビート作成を行っていました。最初に買った機材はMPC1000。よくわからんピエロがついているあれです。高校生の頃バイト頑張って買いました。 買ってすぐは、音楽の知識もリズム感もなくメトロノームに合わせて叩くもドラムがぐちゃぐちゃで挫折したのは良い思い出です。 大学でジャズをやってリズム感を得て、ネラルトさんやスペカンさんの記事を参考にさせてもらいなんとか一端に叩けるようになりました。フィンガードラムはあまり体系化されてないので、この方々の情報はとて

          bkc

          ビートとか作ってみたり

          bkc

          hoverしたら動くやつを作ってみた。

          最近Twitterのタイムラインでお洒落なやつを見つけたので作ってみた。元のようにお洒落になった訳ではないがいろいろ応用出来そう。

          bkc

          hoverしたら動くやつを作ってみた。

          bkc

          Go Exercise: Errors

          interfaceあたりから難しくって脳汁でまくってます。ぼくしです。今回はエラーのところをまとめます。と言ってもinterfaceの扱いの延長なのでinterfaceの理解を深めるってところですね。 ちなみにgo playgroundで一通り触ってnoteにまとめようとしたタイミングでいきなりMacが落ちてびっくりしました。もうそろそろ5年目になるので寿命がきているのでしょうか？ 復習：Stringer復習になりますが、fmtというパッケージにはStringerというイン

          bkc

          Go Exercise: Errors

          bkc