つくねん。/ sesエンジニア

■文系出身 ■転職で未経験からSESへ ■phpメインのバックエンドエンジニア →webアプリケーション開発現場での経験や学習内容、働きに関する気持ちなどを発信しております。 written by Murayama

つくねん。/ sesエンジニア

■文系出身 ■転職で未経験からSESへ ■phpメインのバックエンドエンジニア →webアプリケーション開発現場での経験や学習内容、働きに関する気持ちなどを発信しております。 written by Murayama

最近の記事

友人にプログラミングを教えてみた感想

エンジニア転職をして、1年半くらいたったところで、 「友人にプログラミングに興味があるんだけどやったらいい?」 と話をもらったので、1ヶ月だけ教えてみることにしました。 内容は 検索機能のあるサイトを作りながら、それぞれの役割や書き方、関係性などを学ぶというものにしました。 1ヶ月なので、なんとなくのイメージを掴んでもらって、興味があったら続けるといいよ。的な感じで。 やってみると、意外にも難しい。 前提知識ってこんなに必要かとか、わかりやすく伝えるにはどうすれば良いか

    • CSSでpointer-eventsのpointerとautoの子要素への影響

      この間現場でpointer-eventsのせいで子要素がクリックできないという現象に出くわしました。原因調べた際に、へぇそうなのか。とあまり気にしていなかったpointer-eventsの仕様を学べた気がします。 知っていればあっという間に解決できることでしたので残しておきます。 pointer-events:pointer; こちらを設定すると子要素にはマウスイベントが伝播ません。 親要素が反応するので、子要素にaタグなどあってもクリックできないです。 tableなどで

      • chatGPTのおかげで、技術書が読みやすくなった気がする

        こんにちは。SESエンジニアのつくねん。です。 最近は話題のchatGPTにお世話になることも多くなってきました。 私は、phpを現場で使っていて、学習もphpを深めることが多いのですが TDDやクリーンコードなどの概念を勉強しようとした際に 技術書自体の言語が違う。。。(Javaで書いてあるとか) ということが多々あり、なかなか手が出ませんでした。 他の言語で書いてあるコードもなんとなくイメージはできるけど phpでのコードも知りたい! なんてことはしょっちゅうです。

        • height:auto のときにtransitionが効かない

          こんにちは。SESエンジニアのつくねん。です。 この間アコーディオンみたいな機能をつくっているときに heightを0→auto になるように設定した際に transitionが効かないという状態になりました。 どんな状態だったか? 該当コードをすごく簡略化すると下記のようなコード <div id="button">クリック</div><div id="items"> <div>アコーディオンで表示されるアイテム</div>   <div>アコーディオンで表示されるアイ

          JavaScriptで意図しないグローバル変数に気を付ける

          こんにちは。SESエンジニアのつくねん。です。 現場で開発中相談を受けて、こんなパターンあるんだ!という気づきをいただいたので残します。内容は「コードに意図しないグローバル変数が現れる」という話です。 関数内での変数がグローバル変数として扱われる早速、該当のコード例を。 この状態で動作を確認すると function func(){ variable = "関数内で定義"  // variable は関数内で初めて登場    // 処理が続く}func()consol

          JavaScriptで意図しないグローバル変数に気を付ける

          WEB APIのレスポンスデータ設計

          こんにちは、SESエンジニアのつくねん。です。 前回に引き続きWEB APIのお話です(参考は「Web API The Good Parts」) 今回はレスポンスデータの設計について。 「データフォーマット」と「内部構造」について学んだので残します。 データフォーマットデータフォーマットとは、 WEB APIが返す構造化データをどのように返すかというもので 現在は、JSON形式一択となっているようです。 JSONの他にはXMLなどの形式があるので JSONに標準で対応して

          WEB APIのレスポンスデータ設計

          WEB APIのエンドポイント設計

          こんにちは、SESエンジニアのつくねん。です。 前回に引き続きWEB APIのお話です(参考は「Web API The Good Parts」) 今回はエンドポイント設計について エンドポイント設計って? WEB APIでのエンドポイントとはURIのこと。 つまり、APIの機能を使うためのURIを決めようってことです。 設計の際に何に気をつけるべきか 「Web API The Good Parts」の筆者は以下のようにまとめています。 どんなURIにすれば良いのか?

          WEB APIのエンドポイント設計

          誰かとエレベーターで鉢合わせた時にWeb API をゆるく説明するために。

          こんにちは、SESエンジニアのつくねん。です。 もしいま、「Web API」ってなんですか?と聞かれたら瞬時に答えられない。答えられたとしても、固い説明になってしまいそうで、エレベータースピーチのようなスピーディーにかつ伝わりやすく話せる気がしない。。。 よし、用意しておこう。 超ゆるく簡単に説明して 相手に「あぁ、そういうものね」と言わせることを目的に書いていきます。 Web API とは 一言で言うなら プログラムでHTTPプロトコルを使って、ネットワーク越しに呼ぶ

          誰かとエレベーターで鉢合わせた時にWeb API をゆるく説明するために。

          初級WEBエンジニア 2023年の抱負

          新年、明けましておめでとうございます。 お正月は完全だらだらな生活をしておりました。。。 2023年になってから早くも1週間が経ちましたが この辺で、今年の抱負を掲げたいと思います。 2023年の抱負はこんな感じです。 ブラインドタッチを習得する 全然できないんですよね(笑) 仕事をしながらもタイピング遅いなぁというのをひしひしと感じてます。 現在は、「寿司打」の普通スピードで高級コースをギリギリクリアできるかどうかのレベルです。 やっぱりタイピング速度はエンジニアとし

          初級WEBエンジニア 2023年の抱負

          OpenAIの「ChatGPT」を試してみた話。

          こんにちは。SESエンジニアのつくねん。です。 今週チームメンバーから「ChatGPT」って知ってますか? と聞かれ、名前聞いたことあるぐらいですね。と話したところ 面白いから試してみてください!と紹介いただきました。 なんでも処理のロジックもコードにして考えてくれるんだとか。 せっかくなので、遊んでみました。 ChatGPTってなんだろう「ChatGPT」は人工知能の研究開発をしている非営利団体の「OpenAI」が開発したアプリケーション。 AIが対話形式で質問だったり

          OpenAIの「ChatGPT」を試してみた話。

          どんな時にリファクタリングしてる?

          こんにちは。SESエンジニアのつくねん。です。 開発フェーズが落ち着くと コードをリファクタリングする機会が多くなってきます。 ただ、リファクタリングする必要があるかどうかの判断って ちょっと難しいですよね。 今回はこんなコードがあったらリファクタリングしよう! と私が気をつけていることについてのお話です。 こんな時はリファクタリングしてます。。。 ソースコードに下記を発見した時にはリファクタリングしたいな。 と感じます。 ・重複したコードが存在する ・重複メソッド

          どんな時にリファクタリングしてる?

          [PHP]preg_matchでバックスラッシュ「\」をマッチさせる。

          こんにちは、SESエンジニアのつくねん。です。 最近開発した機能で 値にバックスラッシュが含まれる場合php側で全角に変換する。 という要件のものを実装しました。 まず、値に含まれるかの判断処理としてpreg_matchで一致したらと思い $text = "バックスラッシュ\を含む";preg_match("/\\/", $text); としたところ おや、、マッチしない。 ということでpreg_matchについて調べ直しました。 preg_matchの使い方 pr

          [PHP]preg_matchでバックスラッシュ「\」をマッチさせる。

          オブジェクト指向を学ぶ(OPPって何者だっけ?)

          こんにちは。SESエンジニアのつくねん。です。 開発でクラスやフレームワークを使ってはいるけれども いまいち、「オブジェクト指向」とはなんなのか理解できてなかったので 現場に慣れてきたこのタイミングで再度学習してみました。 参考にしたのは「オブジェクト指向でなぜつくるのか 第3版 知っておきたいOOP、設計、アジャイル開発の基礎知識 平澤 章(著)」です。 この本を選んだ理由 本の構成が「導入」「プログラミング技術」「応用技術」「ゴール」「特別解説」となっており、オブジェ

          オブジェクト指向を学ぶ(OPPって何者だっけ?)

          フルリモートのありがたさを再確認してみる

          こんにちは。SESエンジニアのつくねん。です。 今の現場に常駐してもうすぐ1年が経ちます。 前職では考えられなかった憧れのフルリモート勤務が実現したわけですが 最近はこの生活が当たり前になってきました。 始まったばかりの頃は時間が有り余るほどで驚いたものです。 1日を振り返りながら、この環境のありがたさを再確認しようと思います。 同じくフルリモートしている方たちはどんな過ごしかたをしているのか非常に気になりますね。。。 朝6:30に起床 朝ご飯の前に、自分の好きなことをし

          フルリモートのありがたさを再確認してみる

          SQLで「= NULL」としないのは3値論理だからだってさ

          こんにちは。SESエンジニアの つくねん。です。 SQLでNULLを検索するときに 「= NULL」と書いてはいけない。代わりに「IS NULL」を使う。 というのはSQLの使い始めに必ず学ぶと思います。 私も、そういうもんだから。という公式として覚えていたのですが 他人に理由を聞かれた際にうまく答えられないのが歯痒かったので 簡単に調べてみました。 SQLでは使う値が3種類ある 多くのプログラミング言語の真偽値は 「TRUE」,「FALSE」の2種類の値というのが基本で

          SQLで「= NULL」としないのは3値論理だからだってさ

          CSSクラスの名前づけに困らないようにBEMを覚える。

          現場で新規開発をしているとスタイルを一から組むことがあります。 思いつきで書くと統一感無くしてしまいがちで、結局修正するハメになったり。いつもクラス名をどうすべきかで悩んでいたところにBEMというものを知りました。(デザイン会社からまわってきたコードをみた際にこの書き方になっていてわかりやすかったです。) そこで、この記事ではBEMについて簡単にまとめます。 BEMとは CSSの設計規則。 Block Element Modifierの頭文字を取ったもので Block:

          CSSクラスの名前づけに困らないようにBEMを覚える。