マガジンのカバー画像

スペースマーケット ENGINEERING

138
スペースを簡単に貸し借りできるサービス「スペースマーケット」のエンジニアによる公式ブログです。
運営しているクリエイター

#react

Next.jsのAPI Routesを使ってフロントエンドで完結するAPI処理を実装する

こんにちは。 少し前に「ONEPIECE FILM RED」を見た影響でウタの歌を永遠にリピートしながら仕事をしているmizukiです。 ウタカタララバイという歌のラップパートは鳥肌モノなので、よければ聞いてみてください! (ちなみに僕はAdoさんのがなり声を真似しようと必死になっていたら喉を痛めました。。。) と、雑談はほどほどに、弊社ではフロントエンドのコードをNext.jsへと移行しており、日に日にNext.jsを扱う機会が増えています。 詳しいことは以下の記事で佐伯

2022年夏、スペースマーケットはNext.jsに移行中

こんにちは。開発用のPCをM1 Macbook Pro 14inchに変えてもらってウキウキなサービス基盤グループの佐伯です。 PCのスペックが上がったことにより、ローカルでのJestの実行時間が大幅に短縮できて最高です。Gather繋ぎつつ、Live shareでモブプロしても重たくならないなんて素敵すぎます。 一旦冷静になって本題に入ります。 スペースマーケットでは ゲスト向けのサービスサイトである https://www.spacemarket.com をNext.

チャレンジし続けられる環境がここにある。/フロンエンドエンジニア マネージャーインタビュー

こんにちは、スペースマーケット 採用担当の黒田です。今回はワイルドな見た目とマイルドなお人柄のギャップが魅力的な、フロントエンドチームマネージャーの成原さんにインタビューしてきました!スペースマーケットのエンジニアとして働くことの面白さや、マネージャーとして描く未来など、たっぷりとお届けします。 ーー普段はどんな業務をされていますか? フロントエンドチームのエンジニアマネージャーとして、技術的なマイルストーンを考えることとチームビルディングが主な業務です。 今後のスペー

【React】Contextから渡される値や関数の振る舞いを動的に切り替える

スペースマーケット技術部の和山です、みなさんこんにちは。 先日劇団四季のアナと雪の女王を見てきました。 これだけは言わせてください。 「本当にすごい」 僕は四季に詳しいわけでもないのですが、ここ2、3年でノートルダムの鐘から始まり、アラジンのために何度か足を運び、そして先日アナと雪の女王を見ました。 プロジェクションマッピングの使い方ももちろんなんですが、僕が個人的にすごいなと思ったのがアナとエルサの子役の役者様たちです。 出だしの二人の演技に一気に作品の世界に没入させられ

WebSocketで理解するReact Context

こんにちは!スペースマーケットフロントエンドエンジニアの和山です! オリンピックが盛り上がっていますね! 僕はバドミントン部だったこともあり、すでに終わってしまいましたがバドミントンの試合をライブ配信で視聴していました! 僕の一推し選手は園田選手と嘉村選手です。 2007年の佐賀IHの男子団体である埼玉栄と八代東の決勝を監督が撮影してきてくれて何度も見た記憶があります。(あの映像どこにいっただろう・・・まだどこかにある気が) そんな当時憧れだった選手がいまだに現役でプレー

mswを使ってフロントエンド開発の生産性を上げていこう

こんにちは!スペースマーケットのフロントエンドエンジニアの和山です。 先日うちのわんたろう(雑種・♂)が1歳になりました! 近頃はペットOKの焼肉店というところがありまして、そちらで一緒にお肉を食べながらお祝いしたり、おうちでおいしいちゅーるタワーを食べたりと贅沢しております。 子供の成長はあっという間と言いますが、犬の成長もあっという間でした。 この1年たくさんいろいろな経験ができたと思うので、今年も一緒におでかけしようと思います。 ということで、1年のうちすでに4分の

useContextを使用したReact Compound Patternについて

こんにちわ。 スペースマーケットでFEチームのEMやっている成原です。 子供が言葉をよく覚えるようになってきました。 最近は「ホワタァー!!!!」という言葉を連呼しています。 こいつは強い子に育ちそうだ。 ちなみに娘です。 さて本日はReactのデザインパターン、 Compound Patternについて話します。 Compound Patternについて Compound Patternは数年前から使用されているデザインパターンです。 1つの文脈内で関連する複数のコンポ

【Next.js/Fargate...】シェアリングエコノミーを支えるアーキテクチャ

こんにちは。スペースマーケットの齋藤です。 突然ですがランサーズ様と合同でエンジニアイベントを開催することになりました! スペースマーケットは場所、ランサーズ様はスキルと、シェアリングエコノミーのプラットフォームを提供していますが、それを支えるアーキテクチャは大きく異なっています。 当イベントでは、両社のフロントエンドとバックエンドのアーキテクチャについて、それぞれどのような課題に向き合い、取り組みを進めているのかをご紹介します。 アプローチの違いを含めそれぞれの取り組み

react-hooks-testing-libraryでカスタムフックのテストを書いてみました

年末から2度目のnote投稿です。 スペースマーケットでフロントエンドエンジニアをしている和山と言います。 先日ようやくクリスマスツリーを片付けました。 クリスマスのロスタイムを長めにとってみたのですが結局サンタクロースはきてくれませんでした 。 前回弊社でのフロントエンドのアーキテクチャに関する話を書かせていただきました。 今回は先日カスタムフックのテストを黙々と書いたのでその話をしようと思います。 フックのテストについては触れられていることが少ないなと思ったので、参考

フロントエンドUT文化の根付かせ方とReact Testing LibraryのTips

はじめまして、スペースマーケットでフロントエンドエンジニアをやっている成原です。 趣味は筋トレ。 好きなトレーニングはインクライン・トライセップス・エクステンション。 リモート勤務になりジムにも行けなくなったので、自宅にトレーニング環境を構築し、現在高ボリュームの全身法でトレーニングしています。 (40kgのダンベル×2と60/70/80kgのハンドグリップ) というわけで、本日はスペースマーケットにおけるフロントエンドUTへの取り組みを話します。 UT文化をどのよ

元Javaエンジニアが楽しく書けたReact+TypeScript+ファイル分割のススメ

はじめまして、今年の7月からスペースマーケットでフロントエンドエンジニアをしている和山と言います。 社内ではディズニーが好きな人みたいな感じで認知されている気がします! 今回何を書こうか、でも単純な入社ブログではつまらない!という思いで考えていたのですが、 「最近React書くの楽しい!じゃあその楽しくなった要因ってなんだろう」 というところを振り返ったところを書いていきたいと思います。 対象としては僕のようにサーバサイドからのスキルチェンジの方だったり、最近Reactエ

Next.jsでプロダクションリリースするときに確認したい項目 in スペースマーケット

梅雨も明けて、海で過ごすのが夏らしい季節になってきました。うぇいうぇい 🏖 こんにちは!エンジニアのほりです。 この度スペースマーケットでは、ワークスペースに特化した、遊休スペースとなっている会議室やオフィスをシェアできる「スペースマーケットWORK」の提供を開始しました。 今回、フロントエンドの開発にあたりNext.jsを採用し、弊社としては初めての本番運用だったので、リリース前にチェックしたい項目としてのポイントをnoteにまとめようと思います。 プロダクトやチー

初心者にこそ勧めたいReactHooks

こんにちは。フロントエンドエンジニアの fujino です。 フルリモート生活が3ヶ月ほど続いていますが、開発メンバとのMTGや雑談のおかげで楽しくお仕事できています。 プライベートではスマブラやOCTOPATH TRAVELERを楽しんでおります✨ 今週はキョダイマックスイーブイ狩りですね。ポケモン大好きです。 好きなことばかりやってる人です。よろしくお願いいたします。 最近は弊社のバックエンドエンジニアやアプリエンジニアもReactの勉強を始めたらしいので、React