へっぽこびんぼう野郎のnewbie日記

けろけーろ(´・ω・`)! #vZkt8fc6J

応用情報技術者試験に合格したのでなんかいろいろ書くよ

ぼく

さっき28歳になった。

プログラミング歴は4年1ヶ月

結果

午前61%・午後61%とかいうギリギリで受かっていた。

応用情報の感想

普通に難しかった。とにかく範囲が広い。なんじゃそれってものが多かった。圧倒的に自分に知識が足りないことがわかって悲しかった。

特にOSのしくみ、ハードウェア、ネットワークとか、なんかだいたい全部やべぇって感じだった。マネジメントの知識?会計の知識?知るか!みたいな

よくこれでプログラマできてるなっていう感じの悲しみを味わった。

6割取れてるけど、マークシートなので、確信持ってこれって選べたのはたぶん2割ぐらい。あとは「たぶんこれかなぁ?」とか「とりあえずこれは無い」とかで選択肢絞った結果。

泣きたい。

勉強時間

全くしなかった。

しいて言うなら3年ぐらい前に2回分ぐらい過去問解いてた(過去にこのブログでなんか言及してる)

対策なしで受かったのは午後にRESTの問題が出て、「うっはああああ完璧にわかるううううう」ってのがあったからだと思う。

資格取った感想

合格発表日に胃腸炎でダウンしてたので嬉しさがなかった。「お腹痛いお腹痛いお腹痛い。うわ合格してた。ギリギリだな。うわお腹痛い。もう発表見たし寝よ……」みたいな。

一応応用情報も基本情報も取る意味はあると思う。バカにできないし、知らないこと多すぎるので自分が知らない点を見つけるという点でかなり意味のある試験。 問題もかなり練られている(まぁ国家資格だし……)

応用情報持ってると警視庁で巡査部長相当の捜査官になる試験を受けることができるらしい。月給低いな……

www.keishicho.metro.tokyo.jp

カーネル周りとネットワーク周りがかなり意味不明なので、ちゃんと重点的に勉強しなきゃなと思った。あとデータベース。もうずっとおろそかにしてる。

とりあえず今年はサボってた気がするから、来年はちゃんと勉強するぞい!

日本語の勉強をしている外国人をぶち殺す日本語の文章を書いた

文章

ぼくは幸せトイレ、綺麗!
キタナイトをやっているんだ!
ぼくの大切な仕事はなんといってもやっぱりいややっぱりこれはいあいや、あ、でもやっぱ話すね!
きみはいつもブリブリしゅーんってしてるかな?
してる?まぁじか!
したっけぼく幸せわや!
それで、じつはぼくが綺麗といわれるわけは騎士のかっこよさにあるんだよね!木になる?
でも教えてあげないよ、ジャン!
とりまみんな今日もトイレのぼくをつかってね!
んならね!再見!

正しく認識できているかのチェックリスト

  • ぼくはトイレである。
  • ぼくの名前は「綺麗」である。
  • キタナイトは職業。「汚い騎士」という造語。
  • 「いあいや」の「あ」は誤字。「やっぱりこれはいいや」のこと
  • 「しゅーん」は下に落ちる様子。「しゅ」という音が風切り音を想起させるため。
  • 「まぁじか!」は「マジか!」を柔らかく表現したもの
  • 「したっけ・わや」は、いずれも方言。ただ方言であることを知らなくても、したっけが接続詞、わやが語尾の表現であることを見抜ける必要がある
  • 「木になる」は「気になる」の誤変換
  • 「ジャン」は音
  • 「とりま」は「とりあえずまぁ」の略。スラング
  • 「再見(サイチェン)」は中国語。使用はしないが日本人の理解語彙の範疇。

書いた理由

  • きちんと文法が体にまで根付いていないと簡単な文でも読めない場合があることを自分への戒めとして認識しておきたかったこと
  • 「ここが間違っている。でも意味はたぶんこう」と断言できなければいけないこと
  • 語彙が大きくないと一見簡単な言葉に隠されている意味が汲み取れないこと

その他

なお実際に殺すかどうかは不明。ひょっとしたら案外ふつうに読める説もある。

相対パスでパスを解決するのをやめてプロジェクトルートでパスを解決しよう in create-react-app

相対パスでインポートするのまじだるお

今いる場所とか考えるのだるくね?ファイル移動したら死ぬぞ

import Header from '../../components/Header';
import Grid from '../../components/Grid';
import TransactionForm from '../TransactionForm';
import TransactionSummary from '../TransactionSummary';
import * as AppActions from '../../actions';

だからプロジェクトルートから見に行けるようにする!!!!

import Header from 'components/Header';
import Grid from 'components/Grid';
import TransactionForm from 'containers/TransactionForm';
import TransactionSummary from 'containers/TransactionSummary';
import * as AppActions from 'actions';

べんり

moduscreate.com

↑webpackだけを使ってる人はこれ

↓create-react-appを使ってる人はこれ

medium.com

プロジェクトのルートディレクトリに.envってファイルつくってNODE_PATH = 'src/'とか書いたらおわり(src/のところは自分のソースがあるパスに適宜かえてください)

めっちゃべんり。すごい。捗る

注意点としてはnode_modules下にあるやつと名前がかぶることがあるってことだなあ。誰かなんとかしてくれ

「パルスのファルシのルシがコクーンでパージ」についてしっかり調べてみた

コクーンとパルスという都市がある。

コクーンはパルスの上に浮かんでいる。

月と地球みたいな感じ。

コクーンが上にあってパルスが下にある

コクーンとパルスには、それぞれどちらにもファルシという存在がいる。

ファルシとは人間にとって神的存在。

ファルシはマジやべぇ!!!!!

ファルシは人間をルシというものに変えることができる。

ルシにされてしまうと使命を達成しなければいけない。

もしその使命を達成しなければ、シ骸と呼ばれる化物にされてしまう。

達成してもクリスタルという石にされてしまうのだが(どっちにしてもつらいやつ)

だから、ルシにされるとマジでやべえ!!!

コクーンにいるファルシと、パルスにいるファルシは互いに嫌っている。

コクーンに、パルスが作ったルシが入ると追放されてしまう。

追放されるのはなんかそういう政策のせい。

追放されることをパージという。

都市【パルス】にいるファルシに無理矢理ルシにさせられた人間が、都市【コクーン】でパージ(追放)される。

パルスのファルシのルシがコクーンでパージ

その他

全然やってないんだけどストーリーもネタバレしちゃう

ねたばれ

主人公の妹がパルスのファルシに勝手にルシにされてしまい、コクーンでパージされたから追いかけたけど、妹がクリスタルにされて主人公ブチギレ

なんか主人公たち一行もルシにされる。コクーン聖府に喧嘩売りに行く。

コクーン聖府を統括したり動かしたりしているのもファルシ。このファルシ倒すとコクーンは崩壊して大変なことになる

そこで主人公がとった行動とは……

でもそんなの関係ねえ。ファルシは死ね

そしてコクーンはパルスに墜落する。

墜落中、主人公の仲間がなんか使命果たしたとかでクリスタルになる。

クリスタルになると、なんと、コクーンを支えることができた。墜落せずにすんでよかった!

あと妹もなんかクリスタルから復活した。

妹と妹の婚約者が結婚しておわり

NANJASOREHA

Reactで毎回同じclassName書くのありえないしComponent作ってたら似たComponentばっかできたのでまとめるモジュール書いた

デモ

↓ここで動く

WebpackBin

webpack.bin めっちゃ便利。無いと生きていけない

説明

import React from 'react'
import classnames from 'classnames'

const createClassnamesComponent = (CustomTagName, classnamesList) => {
  const accumulator = {}
  classnamesList.reduce(
    (accum, className) => Object.assign(accum, { [className]: true }),
    accumulator
  )

  const ColumnElement = (props) => (
    <CustomTagName className={classnames(
      Object.assign(accumulator, props.className))} {...props} />
  )

  return ColumnElement
}

export default createClassnamesComponent

こんなかんじで書いてみた。クラス名を配列で渡すと、<CustomTagName className={"クラス名"} />ができて、さらにpropsで拡張できるというだけのモジュール

使い方

import React from 'react'
import ReactDOM from 'react-dom'
import createClassnamesComponent from './createClassnamesComponent'

const Button = createClassnamesComponent('button', ['this-is-class', 'another-class'])
const BoldText = createClassnamesComponent('span', ['bold'])

ReactDOM.render(
    <Button onClick={() => alert("Hello!!")}>
      <BoldText>Hello</BoldText>
      <BoldText>Boy</BoldText>
    </Button>,
  document.getElementById("root")
)

こんな感じ。クラス名がうまく隠蔽されたので明らかにノイズが減って見やすい。便利。

この例だと明らかにボタンの中にBoldTextが入っていることがわかる。

↓隠蔽する前

<button className="this-is-class another-class" onClick={() => alert("Hello!!")}>
  <span className="bold">Hello</span>
  <span className="bold">Boy</span>
</button>

「buttonがあって、classNameがあるな。spanがあって、これはboldか。だからこれはボタンの中にboldクラスがついたspanタグがあるのか」ってなる

そんなの考えたくない。どうしたんだclassName、なんのためのReactだーーーーーー!!!ってなる

感想

こういうメタっぽいことが手軽にできるJSはやっぱりナンバーワン!!!!!!!

探せばすでにnpmにあるような気もするけどこまけえこたあいいんだよ

JavaScriptのfetchでAPI叩いてjson取得時に、camelCaseとsnake_caseの変換マジだりぃわラップした話, yarn!

概要

nodeで書くとこんなかんじ。

whatwg-fetchなどを絡ませたい場合やES6で実装したい場合はこれを参考におのおの作ってください。

暇だったらnpmでインストールできるようにするかもしれないです(たぶんしない)

必要なもの

  • node-fetch
  • humps

Input

const emitMessage = (message, obj) => {
  console.log(`------------${message}----------------`)
  console.log(obj)
}

const fetch = require('node-fetch')
const humps = require('humps')

const Response = fetch.Response
Response.prototype.camelJson = function() {
  const json = this.json()
  return json.then(j => humps.camelizeKeys(j))
}

const humpsFetch = (uri, options) => {
  const isCheck = !!(options && options.headers)
  if (isCheck && options.body && options.headers['content-type'] === 'application/json') {
    options.body = humps.decamelizeKeys(options.body)
  }
  emitMessage('request', options.body)
  return fetch(uri, options)
}

const body = {
  'fooBar': 1,
  'mogeBar': {
    'sA': 1,
    'sB': 2
  }
}

const headers = {
  'content-type': 'application/json'
}


humpsFetch('https://raw.githubusercontent.com/harukaeru/KaeruTimer/master/package.json', { headers, body })
.then(response => response.camelJson())
.then(json => emitMessage('response.camelJson()', json))
.catch(e => console.error(e))

Output

------------request----------------
{ foo_bar: 1, moge_bar: { s_a: 1, s_b: 2 } }
------------response.camelJson()----------------
{ name: 'kaerutimer',
  version: '0.1.0',
  private: true,
  dependencies:
   { lodash: '^4.17.4',
     react: '^16.1.0',
     reactDom: '^16.1.0',
     reactRedux: '^5.0.6',
     reactRouter: '^4.2.0',
     reactRouterDom: '^4.2.2',
     reactScripts: '1.0.17',
     redux: '^3.7.2',
     reduxThunk: '^2.2.0',
     styledComponents: '^2.2.3',
     'timer.js': '^1.0.4' },
  scripts:
   { start: 'react-scripts start',
     build: 'react-scripts build',
     test: 'react-scripts test --env=jsdom',
     eject: 'react-scripts eject' } }

感想

  • なんだかんだprototype便利っていう
  • パフォーマンス落ちる気がする。あまりにもひどかったら別の手段考える