フロントエンドデベロッパーのメモ

スキル: HTML/Jade/Jinja2, CSS/SCSS, JavaScript(ES6), Angular, React,Next, Redux, Node, Express, Python, Flask, Postgres, Redis, MongoDB, Kafka, Knex, SQLAlchemy, React Native, EXPO, GraphQL/Apollo, REST, AWS, Heroku, Docker, CircleCI, SCRUM, XP, Vim, TDD

Error handling about Eureka on Intellij with Java

error list ~/eureka/eureka.iml does not exist Please correct the file content Just reopen Intellij again Failed to bind properties under 'logging.level.com.netflix.eureka' to org.springframework.boot.logging.LogLevel This link helped. http…

GraphQL on Spring Boot

REST vs. GraphQL REST: returns all of data points as designed by developer whether or not you need it. GraphQL: is flexible in return response is a query language for API is used to load data from a server to a client enables client can sp…

画像のリサイズのために未だにGulpを使ってる

Gulpと言うと、数年前に開発プロセスを高速化するために流行ったのを覚えてる。Gulpを3Pdependencyと組み合わせることで、画像のリサイズや自動ページリロード、自動デプロイなどなど便利なことができてしまう。今ならそのほとんどの機能はwebpackで代用する…

AWSでのシステムデザインのためにキャッチアップした知識

クラウドでゼロからサーバーありでのシステム構築する時に困っていたことが、物理サーバーのスペック選定やネットワーク関連の設計だった。なので、この辺りの知識を補うために何冊か本を読んでみたので、今回はその中でもよかった本について紹介する。 ネッ…

counting sort

counting sortは最速の探索アルゴリズムの一つ。 time complexityはO(n+k) 配列は合計で3つ使用する。 探索対象の配列A、indexを記録しておくための配列C、出力用の配列Bの3つ。 配列Cでは、配列Aの中で出現した特定の要素の回数を配列Cのindex順に割り当て…

quick sortについて

quick sortは最も高速な探索アルゴリズムの一つ。 最速でO(n)ただ最悪の場合はO(n2)にもなりうる。 partitionと組み合わせて使用する。 partitionは数列のランダムな位置から1ヶ所要素を決める。これをpivotと呼ぶ。pivotを数列の右端に移動し、残りの要素…

基本的なデータ構造やアルゴリズムについて復習中

8月中旬の院試に向けて勉強してます。 自分の理解度を確認するためのメモ程度に記載してます。他の人が読むと図表も入ってないので、かなり読みにくい内容になってると思います。

ハッシュ法 オープンアドレス ダブルハッシング法

ハッシュ法は検索アルゴリズムの一つ。 各データ(keyと呼ぶ)の挿入するべき位置をハッシュ関数を用いて求める。 ハッシュ関数で求めた値、ハッシュ値が配列の挿入するべき位置(インデックス)を示す。 ハッシュ関数 Hash(key)=key mod m ここでmをテーブルサ…

クローラーの写経してみた

前からクローラー作ってみたいなって思ってたけど、なかなか余裕がないし設計アイデアが浮かばなかったからとりあえずググってみたらわかりやすいのが見つかった。 How to make a web crawler in JavaScript / Node.js とりあえず完璧に写経しただけやけど、…

転職しました!

転職してからしばらく時間が経ったのでダラダラと転職記について更新します。 前回投稿した時は、まだ転職活動中でした。当時は相変わらず転職活動のために面接、コーディングテスト、プログラミングコンテストに参加などして慌ただしい毎日を過ごしていまし…

Python error message: There was a problem confirming the ssl certificate: [SSL: TLSV1_ALERT_PROTOCOL_VERSION] tlsv1 alert protocol

ERROR: There was a problem confirming the ssl certificate: [SSL: TLSV1_ALERT_PROTOCOL_VERSION] tlsv1 alert protocol If you got this error message, update your pip at first. Update pip with curl https://bootstrap.pypa.io/get-pip.py | python…

SeleniumとChromedriverを使ってみた

web developerのJD見てるとわりとSeleniumの使用経験について問われてることが多かったこともあり、前から気になっていました。 Pythonで書きたかったのでSeleniumもPython bindingsをインストールしました。 まず最初は pip install selenium しましたが、…

「SQL 第2版 ゼロからはじめるデータベース操作」読みました

割と時間に余裕が出てきたから以前から積ん読してたうちの一冊を読みきりました。 SQL 第2版 ゼロからはじめるデータベース操作 この本の良い点は、紹介されたクエリを実際にデータベースを作って試せる点ですね。さらにMySQL, Postgers, Oracle, SQLServer…

国名しりとり countries' name caterpiller

頭の体操という事でしりとりしました。 問題の条件は以下です。 与えられた国名リストでしりとりをします。最長を求めよ。 const list = [ "Brazil", "Cameroon", "Chile", "Greece", "Uruguay", "Italy", "France", "Bosnia and Herzegovia", "Germany", "U…

Lazy Loading Images with IntersectionObserver API

恥ずかしながら今まで画像のlazy loadingをまだ試したことがありませんでした。 lazy loadingに注目したきっかけは、HTML関係で足りてない知識を補強しようとフロントエンド向け面接対策を解いてた時に発見したからです。 ちなみにフロントエンドとして働こ…

Cookieにブラウザの表示回数をセットしてみた。

以前にCookieを使って簡単なゲームを作ってみたのでここにコードを残しておきます。 本当はPlunkerとかに保存できたらと思ったんですが、画像を保存したりサブフォルダ作ったりできなかったので諦めました。 このゲームを作った時の条件は以下の通りです。 …

Observableってなに?in JS

最近ReduxのソースコードやMobXのドキュメントを読んでると当然のようにObersevableというキーワードを見かけるようになったのでObservableとはなんぞやということで少し調べてみました。少しだけ調べた結果から言うと、ES7(ES2016)のシンタックスとして追加…

最近の転職活動について振り返ってみました。

ここ数日スケジュール調整、面接やコーディングテストばかりが続いてブログ書いてる暇が全くありませんでした。 メインとしている企業は、受託開発会社は受けず、自社サービス・プロダクトを開発している企業です。 外資系メインで受けていますが、内資企業…

dbuserとdbpasswordってどこにあるの?Where is my dbuser and dbpassword in MongoDB?

English is below. MongoDBをExpress.jsで作ったAPIサーバー上で使用する際に、データベースを確立した時のMongoDB URLがデータベースにリクエストを送る時に必要になります。この時にdbuserとdbpasswordが必要になるのですが、これは一体どこからくるのか?…

Reactのコンポーネントパターンについて。React component patterns

English version is below. Reactのコンポーネントパターンというと色々な考え方がありますけど、大きく分けると3種類だけなのかなと考えています。 ステートなし、ステートあり、あとはコンテナコンポーネントです。 それとステートなしは2種類の書き方があ…

The difference between European Roulette and American

const rouletteFunc = (src1, src2, num) => { return countDifference(makeList(src1, [], num), makeList(src2, [], num)); } const makeList = (listSource, list, N) => { let sliced; for (let i = 0; i < listSource.length; i++) { if (i + N > listS…

Avoid “current URL string parser is deprecated” warning by setting useNewUrlParser to true

(node:4833) DeprecationWarning: current URL string parser is deprecated, and will be removed in a future version. To use the new parser, pass option { useNewUrlParser: true } to MongoClient.connect. When making a server using Mongo, I face…

フィボナッチ数列を漸化式と繰り返しを使って。Fibonacci with Recursion and Interation

フィボナッチ数列の求め方と言えば、再帰で書くのが一番最初に思いつく方法かもしれません。けど、再帰を使用すると数が大きくなるに連れて無駄な計算量が増えていき、計算に時間がかかります。そこで、無駄な計算数を避けるためにメモ化が出てきました。 し…

C++でパターン出力

C++

English version is below. アルゴリズム設計力を磨くために読み始めた本「プログラマの考え方が面白いほど身につく本」の問題例がC++で書かれているので、C++の習得も含めて今日学んだことを書いておきます。 C++で書かれたファイルをターミナルで出力する…

Leetcode projectionArea challenge

This article is written in English in the bottom. 今週のLeetcodeコーディングチャレンジも挑戦してきました。 スコアは自慢できるほどのものではないので、公開はしません。 一番難易度が低い問題に一番苦戦してしまいました。 その問題 projectionArea…

error .babelrc: already exists in working directory

git

git format-patch で作成パッチファイルを作成した。ボスにメールに添付して送る前にgit applyで開こうとするもこのエラーに出くわしてしまいました。 エラー内容はすでにファイルがディレクトリにありますよとのこと。 こちらとしてはすでに存在するファイ…

Node.js, Express.js, Passportを試してみた。

認証認可の開発と言ったらOAuth使ってたけど、今回はPassportを使ってログイン部分のみを作ってみました。 Passportは認証リクエストを手軽に作成できるミドルウェア。Facebook, Twitter, Googleアカウントなどのアカウントでログインすることも多いかもしれ…

React Redux関連のエラーとそれに対するコメント

React-redux error messageUncaught TypeError: (0 , _redux2.default) is not a functiontypo be careful to use {} and ‘’ to import modulesNo reducer provided for keyReact-Redux - No reducer provided for key combinereducer is not a functionafte…