styled-components でスタイルが反映されない問題について

今回は styled-components で記述したはずのスタイルがうまく反映されていないという事象に数日間悩まされたのですが、最終的にあっけない解決方法だったので同じ悲しみを背負う開発者が少しでも減るよう記事に残します。

画像生成AI、 Midjourney をエンジニアで使ってみる会を開催しました!

こんにちは!! vivit で SRE をやっている 宮本 です。 先日、開発部のメンバーで画像生成AI の Midjourney を試してみる(遊んでみる)会があったので、その模様をレポートしたいと思います! 合わせて、vivit で導入しているエンゲージメントを高める為の…

【Shopify】Liquid で JSON をオブジェクトとして扱う

はじめに アウトドア用品のセレクトショップ hinataストア の運用チームで開発をやっている氏家です。 hinataストアはShopifyテーマによって構築されており、Liquidのコードを変更して様々な機能を実装しています。 hinatastore.jp 最近、外部から出力してき…

hinataメディアAPIのリファクタリングを通して感じたこと

こんにちは!バックエンドエンジニアの北條です。 23卒大学生で、今はインターンとして業務に携わっています。 現在「hinataメディア(以下メディア)で使用しているAPIをリファクタリングをする」というタスクを行なっているのですが、新しい発見や学びが多…

Shopify Themeで同系色の商品をカラーチップで絞り込む方法案

フロントエンドエンジニアの氏家です。 私は現在、アウトドア用品のセレクトショップ「hinataストア」の運用を行うストアチームで開発をしています。 hinatastore.jp hinataストアは Shopify で構築されており、フロントエンドは Shopify Theme を使用してい…

vivit技術開発部におけるマイクロサービスへの考え方

SRE

こんにちは!vivitの技術開発部マネジャーの井島です。 開発部ではマイクロサービスアーキテクチャを採用しており、そのアーキテクチャの考え方について話したいと思います。 この分野は個人的に好きで、一生話してられます笑 はじめに 一般的な「マイクロサ…

Apollo で複数の GraphQL エンドポイントに接続する(+ Shopify Storefront API)

はじめに フロントエンドエンジニアの関(@kur0buchi)です。 今回は自分の担当しているhinataレンタルで Shopify アプリケーションと連携する必要ができ Storefront API を使う事になりました。 hinata-rental.me hinataレンタルを始めとした弊社各サービスで…

受託開発の会社からvivitに入社して感じた4つのこと

こんにちは!今年12月からレンタルチーム(hinata rental)のバックエンドエンジニアとして入社した河原田です。 私はvivitに入社する前は受託開発会社のバックエンドエンジニアとして3年弱Golangを書いていました。 自社サービスを開発するのは初めての経験…

gqlgenを使ったファイルアップロード機能を実装して感じたこと

キャンプ場を検索・予約できるサービス(以下hinata スポット)などの開発を担当している名嘉眞です。 hinata スポットなどvivitのいくつかのプロダクトでは、フロントエンドとバックエンドの間にBFFが存在しており、BFFではGraphQLを採用しております。 またB…

Cypress を使った E2E テストを GitHub Actions で実行する

SRE

こんにちは!! vivit で SRE をやっている 宮本 です。 今回は hinata レンタル で行っている E2E テストを GitHub Actions で実行できるように CI パイプラインを構築したので、構成やポイントなどを紹介したいと思います!! 要件とか コミットを GitHub …

vivit の技術スタックを全て公開します!!

これを見れば vivit の技術スタックが全て分かります!!

【23卒】エンジニアの就活した後に考える就活の軸

こんにちは!技術開発部の北條です。 今回は僕が改めて新卒としてエンジニア就活をするならどういったことを重要視するかを考えてみました。 インターンとして5ヶ月経過し、就活の時点で「知っておければ良かった、勉強しておければ良かった」という点がある…

【Next.js】Firebase Authentication でパスワードの変更を実装する

はじめに フロントエンドエンジニアの関(@kur0buchi)です。 hinataレンタルでは先日会員機能をリリースいたしました。 当記事は会員機能実装にあたり調査していく上で適当なパスワード変更のサンプルを探しても現在の環境に丁度よく流用できそうなものが見当…

最高の Kubernetes ダッシュボードを求めて ~2022春~

SRE

こんにちは。 vivit で SRE をやっている 宮本 です! 素晴らしい Kubernetes(以降 k8s) ライフを送るために欠かせないのがダッシュボードです! ダッシュボードには見やすさ、網羅性、操作性など沢山のものが求められます。 k8s の場合はさらに、多くのコ…

Amazon SNSでiOS Push通知を証明書ではなく認証キーで認証する

はじめに こんにちは、技術開発部 事業横断チーム データエンジニアの多田です。 入社時はアプリエンジニアだった私、hinataアプリの保守・運用をたまにやっております。 最近、Amazon SNSのiOS Push通知認証方法を証明書形式から認証キー形式に変更しました…

とあるSREの自宅PC事情

SRE

こんにちは!技術開発部マネージャーをしている井島です。 今回はvivit に私が入社当時(2020年1月)に開発部で社内LTをやっていたことがあり、趣味全開の内容があったので、それを紹介しようと思います! vivitでは2021年8月からマネージャーを行っています…

23卒エンジニアのvivit体験記

こんにちは!技術開発部の北條です。 私は23卒エンジニアとして入社が決まっており、2022年3月からインターンとして参加しています。 今回はvivitへ入社を決めた理由や一ヶ月間のインターン内容、vivitの雰囲気について紹介します。 本ブログでは、21卒の氏…

gRPC Server Streamingでメタ情報も一緒にレスポンスする

キャンプ場を検索・予約できるサービス(以下hinata-spot)の開発を担当している名嘉眞です。 hinata-spotではbackendにGoを、backend間の通信にgRPCを採用しています。 今回はgRPCのServer Streamingでメタデータも一緒にレスポンスする方法をブログにします…

新卒がベンチャーでの1年間を振り返って

フロントエンドエンジニアの氏家です。私が新卒としてvivitに入社してから早くも1年が経過しました。 入社してすぐのとき、アウトプットとしてこのエンジニアブログを頻繁に更新していたのが懐かしいですが、今回はそんな私がvivitで1年間働いて、具体的にど…

mediaチームでのasanaの使い方について

こんにちは!技術開発部 media開発チームリーダーの河村です。 今回はvivitで使用しているタスク管理ツールの「asana」について、こんな使い方をしているという事例を交えつつ紹介します。 asanaについて asanaとはvivitで使っているタスク管理ツールです。 …

GKE に Nginx でレート制限を入れる時の注意点

SRE

こんにちは。 vivit で SRE をやっている 宮本 です! 今回はサービスを Dos 攻撃から守るためにレート制限を導入した際に得られた知見をまとめてみたいと思います。 vivit の各サービスは GKE 上で動いており、 GKE Ingress から最初に転送する Pod は基本…

「エンジニア組織論への招待」という本から学んだ言葉の意味について

こんにちは、技術開発部の河村です。 アウトドアメディア、hinataの開発リーダーをしています。 2021年9月-12月にかけてvivit社内で「エンジニア組織論への招待」の輪読会を行いましたが、今回はその中で普段使っている言葉の意味を改めて知ることで目から鱗…

【デスクツアー】アウトドア企業のプログラマーの作業環境

はじめに フロントエンドエンジニアの関です。 vivit株式会社では一部の社員がリモートワークでの業務を行っています。 リモートワークの詳細な取り組みについては下記の記事をご覧ください。 vivit.hatenablog.com 私個人としては感染症リスクについてはと…

Datadog で「リリース後にだけ」利用するモニターを作成する

SRE

こんにちは。 vivit で SRE をやっている宮本(https://github.com/tatsuro-m)です! 今回は Datadog で「リリース後にだけ」利用するモニタリングリソースをどうやって作成、運用していったかを書いてみようと思います。 基本的には常時 OFF(ミュート)で…

Goでコンストラクタ関数(完全コンストラクタ)を定義する

はじめに vivitで hinata spot というキャンプ場の検索・予約サービスのbackendを担当しています名嘉眞です。 hinata spot のbackendはGoで書かれています。 今回は、Goでコンストラクタ関数(完全コンストラクタ)を定義した際の問題や対応策について書きます…

vivit 開発部はナレッジ・ドキュメントが豊富

はじめに こんにちは!開発部マネージャーをしている井島です。 開発部では以下で紹介されているように、強みとして「ナレッジ・ドキュメントが豊富」も挙げられています。 vivit.hatenablog.com 今回は、実際にどんなドキュメントがあるか少し紹介していき…

【2022年1月】最近のvivit開発部の特徴は?

はじめに こんにちは、技術開発部 事業横断チーム ひよっこデータエンジニアの多田です。 前回の記事を書いてから一月ほどでしょうか。 前回は自称データエンジニアでしたが、今はひよっこデータエンジニアをしています。 vivit.hatenablog.com 最近分かった…

リモートワークでのvivitの取り組み

技術開発部の小原です。 アウトドア用品専門買取・販売サービス、hinataリユースでバックエンドの開発を行なっています。 www.hinatareuse.jp はじめに 新型コロナウイルス感染症の拡大に伴う出勤抑制の方策として、一部リモートワークでの業務を行なってい…

React と Svelte を比べて感じたこと

フロントエンドエンジニアの氏家です。 最近、JavaScript のフレームワークであるSvelteに関する記事を多く見かけるようになりました。 僕の中で「何か新しいフレームワークが出てるなぁ」から「面白そうだし触ってみよう」という気持ちに変わったので、vivi…

react-philosophies を読んでの所感

はじめに フロントエンドエンジニアの関(@kur0buchi)です。 プログラマとして自分で新しくコードを書いたり、誰かの書いたコードをメンテナンスする中で「良いコードとは」を悶々と考える日々を送る中、先日 Twitter のタイムライン上で mithi/react-philoso…