ミナミタカオ

フリーランス Coder WordPress / MovableType / Nex…

ミナミタカオ

フリーランス Coder WordPress / MovableType / Next.js / Astro コーディングでお困りでしたらお力になります 15年間 会社勤務でWeb制作、2021年10月より屋号BUMBUMとして独立しました https://bumbum.biz

コーダー（Webサイト制作）のNode.js環境困りごとをNVMで解決する

Webサイトを制作するにあたっては、直接Node.jsで何かするという事はないのですが無くてはならないものになりました。苦手意識を持つ方も多いのではないでしょうか。 先輩の環境では問題ないので、私の環境ではエラーで全然動かない、、、 別のメンバーが作ったサイトの作業環境がエラーで全然動かない、、、 なんていう話もよく聞きます。 Node.jsのバージョンの差がそういった問題を起こす事も少ないありませんので、ここではNVMというツールを使って解決してみたいと思います。

ミナミタカオ

    • Locomotive Scrollについて

      Locomotive ScrollはどんなJavaScriptライブラリ？公式サイト・デモ：https://locomotivemtl.github.io/locomotive-scroll/ Github：https://github.com/locomotivemtl/locomotive-scroll Locomotive Scrollはパララックスやアニメーション、横方向にコンテンツを展開させるなど、スクロールエフェクトを実装する為のJavaScriptライブラリで

      ミナミタカオ

      • create-react-appのエラーで困った話。（You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0).）

        You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0).We no longer support global installation of Create React App.Please remove any global installs with one of the following commands:- npm uninstall -g create

        ミナミタカオ

        • 会話と記憶、感謝。 つれづれと。

          今朝、妻に指摘された言葉がすごく印象的だったので書き残します。 朝の情報番組でディズニー特集が放送されていました。 家族みんなで朝ごはんを食べながらみていたわけですが、 当然子供たちはディズニー行きたい！！となります。 少々性格がゆがんでいる父ちゃんこと私は、 「今遊びに行っても記憶にないでー。父ちゃんも子供の時行った記憶、一ミリもないしー。」 と言い放ち子供たちのディズニー行きたい盛り上がりを冷やかしておりました。 その時、妻から 「父ちゃんは両親と会話がないから覚えて

          ミナミタカオ

        コーダー（Webサイト制作）のNode.js環境困りごとをNVMで解決する

        ミナミタカオ

          docker-composeで立ち上げたMysqlにデータベースを追加

          手元の開発用なので面倒は避けてパスワードなしのログインを許可しておく。（docker-compose.yml） MYSQL_ALLOW_EMPTY_PASSWORD: "true" コンテナIDを確認。 docker ps コンテナにターミナルでログイン docker exex -it コンテナID bash MySQLへログイン mysql -u root -p データベースを追加 create database データベース名; 作業ユーザーに権限を

          ミナミタカオ

          docker-composeで立ち上げたMysqlにデータベースを追加

          ミナミタカオ

          Next.jsでビルド時にエラーに遭遇した時の話。

          Next.js+WordPress+Vercelの構成で運営しているCheckWebTechというギャラリーサイトを運営しています。（https://cwt.jp/） WordPressで記事公開をトリガーにVercelにデプロイを投げる仕組みなのですが、これが動かなくなりました。 エラー内容Vercelのビルドログを確認するとエラーが発生しているようです Error occurred prerendering page "/404". Read more: https

          ミナミタカオ

          Next.jsでビルド時にエラーに遭遇した時の話。

          ミナミタカオ

          Sassの@importの問題点を理解する。

          @importは廃止されます @importを使って別ファイルを読み込む方法を変える必要があります。 下記、公式サイトにも書かれている通り、今後廃止されます。 The Sass team discourages the continued use of the @import rule. Sass will gradually phase it out over the next few years, and eventually remove it from the la

          ミナミタカオ

          Sassの@importの問題点を理解する。

          ミナミタカオ

          デザインデータで設定されているカーニングをCSSで再現したい

          illustratorやPhotoshopのデザインデータ上で設定された数値を再現するためのメモです。 https://helpx.adobe.com/jp/illustrator/using/line-character-spacing.html 字送りとカーニングの値は、現在の書体サイズを基準とした 1/1000 em 単位で指定します。 1 em は、6 ポイントのフォントでは 6 ポイントになり、10 ポイントのフォントでは 10 ポイントになります。 カーニング

          ミナミタカオ

          デザインデータで設定されているカーニングをCSSで再現したい

          ミナミタカオ

          Next.jsをTypeScript+TailwindCSS環境で構築する準備作業

          Mac環境、Node.js はv14系、VSCodeのターミナル操作です。 まずはプレーンなNext.jsプロジェクトを構築します。 作業フォルダ内で下記コマンドを実行すると必要なファイルが揃う。 npx create-next-app . TypeScriptを使えるように準備します。公式ドキュメントの記載の通りではありますが、まずは下記のコマンドでTypeScriptの設定に使うからファイルを先に作成しておきます。 touch tsconfig.json 次にT

          ミナミタカオ

          Next.jsをTypeScript+TailwindCSS環境で構築する準備作業

          ミナミタカオ

          Hello World.

          こんにちわ。ミナミタカオと申します。 今年4月に8日間の入院中、自己対話を繰り返した末、意識が高まりすぎた結果、会社を辞めてフリーランスとして駆け出してしまいました。 プライベートでは3児の父、会社ではWEB制作チームのマネージャー。 自分と向き合う事からもう10年ほど遠ざかっていましたものですから、 入院中、自分自身と向き合うだけの８日間はとても刺激的で自分と家族の人生を変えるには十分すぎる時間でした。 これまで15年ほど、Webサイトを作り続けてきました。 主にコー

          ミナミタカオ

          Hello World.

          ミナミタカオ