スマートキャンプで業務委託でエンジニアをしている佐藤です。BOXILの開発を1年3ヶ月前から、沖縄からフルリモートでやっています。 皆さんは、毎日楽しくお仕事できていますか？　エンジニアという職業は労働時間やストレスが多く、IT業界は他の業界と比べて精神疾患にかかりやすいと言われています。 私はもともと自己否定ばかりしてしまう思考の癖があることに加えて、7年前に起業に失敗してメンタルを壊してしまったことをいまだに引きずっていて、日々悩みながら生活をしています。 スマートキャンプは、過労とは無縁で、メンバー間のサポートもよく、これ以上ないくらい私に合った職場です。それでも自分の心の問題で不安になったり、絶望感に襲われたりすることがあります。今回はそうなるたびに書き綴ったメモを、開発中にネガティブな気持ちにならないための技術としてまとめようと思います。 メンタルが強くないエンジニアはこんな気持

スマートキャンプ、エンジニアの入山です。 2020年7月にDockerとAWSのコラボレーションにより、単一コマンドでDocker ComposeのyamlファイルからAmazon ECS上に各コンテナをデプロイできる機能追加が発表され、非常に注目を集めました！ From Docker Straight to AWS - Docker Blog AWS and Docker collaborate to simplify the developer experience | Containers ローカルでDockerを利用して開発を行っている方々は、ほぼ間違いなくDocker Composeを利用してアプリの動作に必要な各コンテナを一括管理しているかと思いますが、このECS Pluginを利用するとAmazon ECSへの各コンテナのデプロイとECSの動作に必要な各AWSリソースを一括し

ボクシルのプロダクトマネージャーをしている笹原です。 ボクシルの開発チームは今年に入ってから規模をかなり拡大してきました。 一番少なかった2月と比べて3倍近い規模になり、拡大傾向も落ち着かせるフェーズになってきました。 そこで、今回はチームの規模を拡大する中で起こったことや、それに対してどのように対応してきたのか振り返って行きたいと思います。 併せて読んで欲しい記事 昨年の12月に同じように振り返ったときの記事です。 tech.smartcamp.co.jp 2020年2月〜: 2チーム制 この時期の体制 リモートワークへの対応 2020年4月〜: 1チーム制 この時期の体制 チーム内のコミュニケーションコスト増加 2020年6月〜: 3チーム制 この時期の体制 ストーリーポイントの安定化 ボトルネックが開発から企画へ 2020年9月〜現在: プロジェクトチーム制 この時期の体制 まとめ

こんにちは！スマートキャンプでインサイドセールスに特化した SaaSを作っているエンジニアの中川です。 上記プロダクトのフロントエンドは Vue.js を用いて開発しているのですが、 その中で SFC 内のtemplateタグで使用していた Pug をやめて HTML に移行した件をこの記事ではお話しようと思います。 また、実際にtemplateタグに ESLint を効かせてみて発覚したエラーや警告のなかで数が多かったものや、これから Vue 3 に移行していく上で対応する必要があったルールを紹介します。 背景 eslint-plugin-vue が効かない チームに Pug 推進派がいない Pug を HTML に移行するには Vue 3 に準拠した Lint ルールを導入する Lint を実行してみる 対応した目ぼしいルール vue-require-v-for-key vue/val

こんにちは！スマートキャンプのエンジニア、瀧川です。 私は今BOXILの開発を担当していて、Railsアプリケーションとしてローンチから6年近く経つプロダクトとなります。 その間に溜まった技術的な負債については、タスクの中で併せて解消したり、プロジェクトの合間でまとめて時間をとったりと前向きには取り組んでいる(先日Rails6, Ruby2.7にあげました👏🏻)のですが、どうしても優先度が下がる改善がいくつかあるなと思っています。 今回は改善の優先度が低かったけど、割とストレスに感じていたi18n定義の自動整理をやってみた話を紹介しようと思います！ 地味に苦戦したんですが、結果として全体の1/3を占めていた未使用のi18n定義を自動削除することができました！ i18n(internationalization)とは 今回やること 解決方法 i18n-tasks ハマったところ i18n

初めまして！8月よりスマートキャンプにエンジニアとして中途入社した吉永です！ 私は現在19歳で、通信制の大学に通いながらエンジニアチームの一員として開発に携わっています。 プログラミングは中学生の時に始め、高校在学時にとあるスタートアップ企業でインターンしたり、卒業後はエンジニアとして正社員で開発を行っていました。 得意分野はフロントエンドで、主にVueやNuxtを使った開発が好きですが、前職ではLaravelやDjangoを使ったバックエンドの開発も行っていたため、メンバー構成に左右されない柔軟な開発を行えることが強みだと思っています。 薪入れ作業でChrome拡張機能を開発しました なぜこの拡張機能が必要だったのか どうやって作ったか 主要ファイル解説・作り方 詰まったところ 全体的なまとめ 参考にさせていただいたサイト 薪入れ作業でChrome拡張機能を開発しました スマートキャンプ

こんにちは！スマートキャンプに21卒入社予定の関口大地です。 私は現在大学に通っている4年生で、法律学を専攻しています。大学では法律学を専攻していますが、在学中に趣味ではじめたプログラミングの楽しさにハマり、Webエンジニアを目指し就活をしていました。 今年の1月にスマートキャンプから内定をいただき、 今年の4月からBOXIL開発チームで内定者としてインターンをしています。 今回のブログでは、内定者インターンとして業務をする中で気がついたことを、紹介していこうと思います。 なぜ内定者インターンをするのか？ 内定者インターンを始めてからの気づき 質問できない背景を考えてみた 実際に試してみたこと この経験から学んだこと なぜ内定者インターンをするのか？ 私は今年の4月から内定者としてインターンをしています。 私はこの内定者インターンを始めるまで、開発の業務経験はありませんでした。 このインタ

スマートキャンプの20卒エンジニアの高砂です！ 皆さんは、JavaScriptにおける絵文字の扱われ方が難しい事をご存知ですか？ 本記事では、その背景と適切な方法を解説していきます！ JavaScriptにおける絵文字の問題点 問題点の再現 問題点の背景 絵文字を適切に扱う方法 まとめ JavaScriptにおける絵文字の問題点 JavaScriptで文字数カウントを実装する際、素直に考えると下記のようなコードになるかと思います。 const text = 'おはよう😊' console.log(text.length) しかし、実は「絵文字が含まれている文字列は.lengthでは適切にカウントできない」という問題点があるのをご存知でしょうか？ 実際にご覧頂くのが早いと思うので、CodePen様をお借りして文字数カウントをしてくれるアプリを簡単に作ってみました。 以下に置いておきますので

こんにちは、 https://boxil.jp を作っている徳田です。 今回は技術共有ミーティングであるSMARTCAMP Tech Talk、通称「STT」と、Stay Home環境下でのコミュニケーション施策について紹介します。 SMARTCAMP Tech Talkについて はじまった経緯 準備するKibelaのイメージ 数回開催した結果 他: 在宅勤務でのコミュニケーション施策について プロダクト本部 夜会 メンバ間1on1 SMARTCAMP Tech Talkについて 2週間〜1ヶ月ぐらいの頻度で開催される、エンジニア達がそれぞれ興味のある技術ネタを持ち寄って紹介するミーティングです。 用意されたKibelaにそれぞれが事前に紹介したい内容を書いておき、それをもとにワイワイ話します。 持ち時間は一人5分程度、ラフなLT大会のようなノリで実施しています。 はじまった経緯 スマート

スマートキャンプ、プロダクトマネージャーの郷田です。 弊社スマートキャンプのセールスチームに、開発チームで行っているKPTによる振り返りを導入してみました。 この記事では実際にKPTを導入するまでの背景と流れ、また実施してみたセールスチームからの感想を紹介いたします。 きっかけ 何ができるか考える やってみた 心理的安全性の説明 リーンコーヒー KPT セールスチームによるKPTの感想 セールスチームに導入してみて まとめ きっかけ ある日に1日かけて、ボードメンバーとセールスチームのマネージャー数名と共に、BALES（自社サービス）の現在のアウトカムの設定・ターゲットの詳細化・仮説の設定などを行うMTGでファシリテーターをさせていただく機会がありました。 ディスカッションの準備から関わらせてもらったため、参加されてた方からは「フレームワークを使いふわっとしたことを整理するのが得意な人」と

スマートキャンプ、エンジニアの入山です。 突然ですが、みなさんはAmazon ECSを利用したことはありますか？ コンテナで開発したアプリケーションをフルマネージドで運用してくれるECSですが、その環境構築を簡単に一括で行ってくれるサービスAWS Copilotが先日発表されました！ AWS Copilotでは、ECSの環境構築だけでなく、GitHubと連携したCI/CDの構築もできるようになっており、AWSやCI/CDの知識や知見がなくとも手軽にコンテナでのサービス立ち上げができます。 AWS Copilotを利用したECSの環境構築については、AWS公式のブログで詳しく紹介されていたので、今回はAWS Copilotを使ったGitHubと連携したCI/CDパイプライン構築を中心に紹介したいと思います！ aws.amazon.com AWS Copilot とは AWS Copilotで

こんにちは。プロダクト本部で本部長（開発に関わる部署のマネージャー的な役割）をしている米元です。 弊社では昨年から技術顧問としてヨシオリさんに参画して頂いております。 今回はヨシオリさんにこれまでどんな形で関わって頂いたのか、スマートキャンプがどのように見えるのかを話して頂きました。 ​ 最初に自己紹介をお願いします！ 技術顧問を始められた背景を教えてください 試行回数を増やしたい 視野を広げたい 技術顧問として開発チームとどんな関わり方をしていただいていますか？ スマートキャンプ開発チームの印象はいかがでしょうか？ 全体的な印象 良いところ 改善点/足りない点 スマートキャンプで活躍できそうなはどんな人でしょうか 開発チームへの今後の期待をお願いします！ まとめ 最初に自己紹介をお願いします！ 庄司嘉織といいます。 インターネット上でも twitter.com/yoshiori とか y

ボクシルのプロダクトマネージャーをしている笹原です。 今年頭からエンジニアではなくプロダクトマネージャーに業務内容をシフトしています。 しかし、エンジニアブログは技術ネタを書こうかと思い、表題の件をサクッと試してみました。 AWS Client VPNとは AWS Client VPNのクライアント認証とユーザー管理 AWS SSOとは AWS SSOでのカスタムSAML2.0アプリケーションの追加 SAML2.0認証を利用したAWS Client VPNエンドポイントの作成 実際に使ってみる まとめ AWS Client VPNとは AWS Client VPNとは、AWSが提供しているクライアントベースのマネージドVPNサービスです。 マネージドなVPNサービスということでリモートワークが増えた今年から利用も増えているのではないかと思います。 詳しく知りたい方は、以下の記事を御覧くださ

こんにちは！スマートキャンプでエンジニアをしている中川です。 先日Twitterを何気なく眺めていたところ、Vue.js 生みの親の Evan You氏が何やら興味深いツイートをしているのが目に止まりました。 As I was going to bed, I had an idea about a no-bundler dev setup (using native browser ES imports), but with support for Vue SFCs **with hot reload**. Now it's almost 6AM and I have PoC working. The hot reload is so fast it's near instant.— Evan You (@youyuxi) 2020年4月20日 ...なるほど。これまでReactやVueを

スマートキャンプ、エンジニアの瀧川です。 弊社では毎週火曜日に30分間、エンジニア全体MTGがあり、全体やチームの動き、採用やイベントについて話すようにしています。 その中に「最近のワイ」というコーナーがあります。 (こちらに詳細が書いてあります) YWTで振り返るエンジニアリングマネージャーになってからの1年間 - SMARTCAMP Engineer Blog これは直近の数ヶ月で、「やったこと」「はまったこと」「わかったこと」「次やること」を振り返り、共有する試みで、弊社エンジニアの伝統となっています。 今週が私の担当だったのですが、失念していて準備を忘れるというインシデントが発生したため、反省の意を込めてブログで公開させていただきます。 「最近のワイ」自体はとてもいい試みなので、参考にしていただければ幸いですし、弊社の雰囲気も感じていただければと思います！ 最近のワイ やったこと

皆さんこんにちは！ 21卒の内定者として現在BOXIL開発チームでインターンをしている関口です！ 私は今年の4月からスマートキャンプでインターンをしていますが、このインターンを始めるまで、業務としてプロダクトを開発したことはありませんでした。 業務としてプロダクトを開発するようになってから、自分が今まで使ってこなかった開発手法、技術、サービスがたくさんあるということを知りました。 今回のブログでは特に最近勉強になったBOXILの運用を支える監視ツールについて紹介していきたいと思います。 監視をおこなう理由 BOXILで利用している監視ツールについて Mackerelとは Bugsnagとは New Relicとは 最後に 監視をおこなう理由 そもそもなぜ監視をおこなう必要があるのでしょうか？ 監視をおこなう理由を一言で表すなら 「システムを安定して稼働させ、稼働効率を上げるため」です。 ア

こんにちは、BOXILの開発をしている徳田(@haze_it_ac) です。 今回は業務と少し離れた話をしてみます。 はじめに みなさんは仕事以外でもWebアプリケーションを作っていますか？ 作りまくっている人も、仕事以外ではコードを書かない人も居るかと思います。 私は気になったライブラリを見つけたり、こういう実装ってできないかな？と思った際に、簡単なWebアプリケーションを作って試しています。 この記事ではその中で、ゴールデンウィーク中に "簡単に作れて、運用が楽な SPA/SSR + API Server 構成の小さなWebサービス" を考えて試した際の構成と、作成手順を紹介します。 サンプル 画面 https://blog-sample-fe.now.sh/ 見た目が雑で申し訳ないのですが、サンプルとして 会員登録 ログイン 会員ページ ログアウト 機能を実装したものです。 構成 全

こんにちは！スマートキャンプでエンジニアをしている中川です。 いきなりですが、つい先日待望の Vue.js 3.0.0 beta がリリースされました！ We just released Vue 3.0.0-beta.1! Here's an overview from @youyuxi on the status of 3.0 core and official tools & libraries: https://t.co/7TP5ZMtjK4— Vue.js (@vuejs) April 16, 2020 ステータスは beta なのでいま2系からアップグレードすることに抵抗はありつつも、待望の新バージョンなので内容が気になる・試してみたい方も多いのではないでしょうか。（かくいう私自身がそうです） そこで今回の記事ではVue.jsの今後のロードマップを紹介して、何がいつリリースされる

スマートキャンプのデザイナー/エンジニアのhaguriです。 弊社では3月からリモートワークに移行しています。 スマートキャンプでは開発チームが、「BOXILチーム」と「Biscuetチーム」の2つあります。 以前の記事では、リモートワーク中の開発チームの様子や、行っているコミュニケーションの工夫などを紹介しました。 tech.smartcamp.co.jp 今回は、2ヶ月弱リモートワークをすることで見えてきた「Biscuetチーム」内の課題と解決に向けて試した方法について紹介します。 発生した課題「認識のズレ」 改善1：共通で呼べる名前をつける 改善2：必須確認事項をいつでも見れるようにする 改善3：アイテムごとにUIを作成して、UIを軸に話し合う 改善4：KPTを付箋のようにやる 「認識のズレ」をビジュアルコミュニケーションで改善 発生した課題「認識のズレ」 通常では、あるトピックにつ

こんにちは！フリーランスエンジニアとしてスマートキャンプに参画している芳岡です。 弊社のプロダクトであるBiscuet(https://biscuet.jp/)の開発に初期から参画していますが、サービスが世の中に展開されていく過程、チームが大きくなっていく過程を間近で見れとても興味深く思っています。 今回は、そのBiscuetで使用しているVue.jsのパフォーマンス改善を行ったのですが、そこで気づいたいくつかのポイントを整理してお届けします。 Vue.jsのパフォーマンス 関数型コンポーネント propsは、オブジェクト全体か各プロパティごとか？ プロパティごとに渡す方法 オブジェクトを渡す方法 注釈 最後に Vue.jsのパフォーマンス Vue.jsでは、状態変更によって、仮想DOMが繰り返し再計算（updateRender)されるため、それによりパフォーマンスが悪くなることがあります