LINICA エンジニアチームブログ

Web制作、UXデザイン、ブランディングを得意とする、株式会社LINICAのエンジニア…

LINICA エンジニアチームブログ

Web制作、UXデザイン、ブランディングを得意とする、株式会社LINICAのエンジニアチーム。日々の業務で気づいたこと、勉強の記録を投稿します。コーディングのみのご相談でも、お気軽にお問い合わせください。https://linktr.ee/linicainc

Figma for VS Code 使ってみた

こんにちは！フロントエンジニアの橋本です。 先日、CSS Niteの朝までマークアップ アーカイブを視聴しました。 いろいろな方がマークアップについてお話されている中で、Figma for VS Codeについて話している方がいらっしゃいました。 そもそもfigmaにはXDと同じく、開発者モードというものが存在するのですが、今まで使ってこなかった（XDのものが使いづらかったので、抵抗があった）ので、これを機にFigmaの開発者モードと、Figma for VS Codeを

LINICA エンジニ…

    • Contact Form 7で確認・完了画面を作りつつ、自動返信メールの内容を条件分岐させたい　後編

      はじめにこの記事は、Contact Form 7で確認・完了画面を作りつつ、自動返信メールの内容を条件分岐させたい　前編の続きです。 前編では、入力・確認・完了画面を作成し、自動返信メールを送信できるようになるところまで実装しました。 後編では、Conditional Fields for Contact Form 7を使用して、自動返信メールに条件分岐を追加していきます。 各フォームに条件付きフィールドグループを追加するお問い合わせ＞コンタクトフォーム　から、お問い合

      LINICA エンジニ…

      • Contact Form 7で確認・完了画面を作りつつ、自動返信メールの内容を条件分岐させたい　前編

        はじめにこんにちは。フロントエンジニアの橋本です。 WordPressのContact Form 7は、お問い合わせフォーム実装の際におなじみになっているプラグインですよね。 最近まで弊社は、同じくおなじみだったMW WP Formを使用してフォームを実装することが多かったのですが、先日、開発を終了する旨が発表されたため、Contact Form 7を使用しての実装に切り替える方針になりました。 そして、入力フォーム→確認画面→完了画面の実装と、自動返信メール（入力フォー

        LINICA エンジニ…

        • 速くて賢いバージョン管理ツール「Volta」を導入してみた

          こんにちは、LINICAのフロントエンジニアの丸山です。 Node.jsのバージョン管理ツールとして、 nodenv を使っていましたが、少し前から Volta に移行したので紹介します。 Volta インストールVoltaをインストールする前に、すでに使用しているNodeのバージョン管理ツールをアンインストールしておく必要があります。 どこにNodeがインストールされているか確認。 which node↓↓↓自分は、anyenvというのを使って、nodenvをインス

          LINICA エンジニ…

        Figma for VS Code 使ってみた

        LINICA エンジニアチームブログ

          Next.jsの基本的な使い方&特徴をざっくりまとめてみました

          こんにちは！LINICAフロントエンジニアの橋本です。 少し前にNext.jsを使った実装を行なったので、備忘録的に環境構築方法、特徴などを書いていきます。 Next.jsとは？環境構築方法※事前にnodeのインストールが必要です。 npx create-next-app sample sampleの部分は適宜変えてください。設定に関しての質問をされるので、YesかNoを選んで進めます。 また、以下はおそらくYesにした方が楽です。（いちいち相対パスでファイルを指定

          LINICA エンジニ…

          Next.jsの基本的な使い方&特徴をざっくりまとめてみました

          LINICA エンジニアチームブログ

          WebPを使ってみよう

          こんにちは、LINICAフロントエンジニアの中村です。 社内向けに発表したWebPについての資料を投稿します。 画像のファイル形式について考える際の一助になれば幸いです。 WebPとはなんなのかWebP（ウェッピー）は、米Googleが開発しているオープンな静止画像フォーマット。ファイルの拡張子は「.webp」。 非可逆圧縮のJPEGや可逆圧縮のGIF、PNGの置き換えを意図する規格である。 ファイルサイズは非可逆圧縮モードで（同一画像、同等画質の）JPEGと比較して25-

          LINICA エンジニ…

          WebPを使ってみよう

          LINICA エンジニアチームブログ

          stylelintでCSSを自動チェック&自動フォーマット

          こんにちは！LINICAフロントエンジニアの橋本です。 CSScombが開発終了になってしまったので、Scssを自動フォーマットしてくれる他のツールを探していたところ、Stylelintが良さそうだと思ったので導入してみました。 構文チェック、書き方の統一、自動でプロパティ入れ替えなどをやってくれます。 導入方法1. VS Codeに拡張機能のStylelintを入れる 以下の拡張機能をVS Codeにインストールします。 2. npm install npm i

          LINICA エンジニ…

          stylelintでCSSを自動チェック&自動フォーマット

          LINICA エンジニアチームブログ

          無料で企業分析ができるツール4選

          こんにちは、LINICAのフロントエンジニアの大島です。 最近「分割型キーボード」が気になっていますが、沼に踏み出す勇気がなくギリギリのところで踏ん張っています。 弊社ではエンジニアも企画段階から会議に参加することが日常茶飯事です。エンジニアの視点から色々と意見を出しますが、企画の根幹に関わるビジネスサイドの議論に加わることも少なくありません。 企業分析する上で必要な情報は、例えば以下のようなものです。 経営計画 業界でのポジション マーケットシェア 競合他社

          LINICA エンジニ…

          無料で企業分析ができるツール4選

          LINICA エンジニアチームブログ

          サイトリニューアル時に忘れがちなもの7選

          皆さん、初めまして。株式会社LINICA エンジニアチームです。 株式会社LINICAは、Web制作、UXデザイン、ブランディングを得意としているWeb制作会社です。noteを通してみなさんに少しでも役に立つ情報を共有できればと思い、この度noteを開設しました。 今回は、サイトリニューアル時に忘れがちなものを取り上げてみました。 Webサイト計画時はどうしてもトップページや重要なコンテンツに注意が向きがちですが、以下のようなページや要素を忘れていると公開直前でバタバタ

          LINICA エンジニ…

          サイトリニューアル時に忘れがちなもの7選

          LINICA エンジニアチームブログ