フロントエンドエンジニア

スマレジのテックファーム（SES 部門）で Web 系エンジニアとして働いている やまて（@r_yamate） と申します。 2023 年 4 月からは、スマレジの関連アプリの開発業務を担当しています。触ったことのなかった Flutter での開発を担当（そして React も…）することになり、日々奮闘中です。開発しているアプリはモニター利用も始まり、開発の醍醐味を味わえていて楽しいです。 はじめに 業務で必要になったため、React に入門します。 フロントエンドの実務経験は無いので、効率的にキャッチアップして、いち早く実務でタスクをこなせるよう、React 学習ロードマップを作ります。 …

はじめまして この記事について 移行前の環境 移行の流れ Vue 3.3 移行について 破壊的変更の対応について 1. v-model v-bind.syncについて 2. v-on.native 修飾子の削除について 3. vue-i18n 8.x → 9.x の破壊的変更対応 移行時の苦労 担当者曰く Vuetify2 から Vuetify3への移行について 全体的な変更 移行時、移行後の苦労 移行後の環境 移行後の使用感 最後に はじめまして サービス開発統括本部 ソリューション開発部で農業プロダクトの開発を担当している西村です。初めてのTECH BLOGです。 私は現在、ピンポイントタ…

こんにちは。 昨年に引き続き、『Vue Fes Japan 2023』のプラチナスポンサーとしてCloudSign（クラウドサイン）が協賛・出展します！ Vue Fes Japanとは Vue Fes Japan（ビューフェスジャパン）は、JavaScriptフレームワークの代表格であるVue.jsに関する、日本最大級のカンファレンスです。 年に1回、国内外のVue.jsユーザーが一堂に会し、それぞれのスキル、職種、文化に縛られることなく、技術的なノウハウやVue.js愛について熱く語り合います。主催者は、Vue.jsの日本向けユーザーコミュニティである、Vue.js日本ユーザーグループです。…

イベント概要 2023年8月2日に「What’s “Next” JS Meetup」と題してバベル社のuhyoさんをお招きしてNext.jsに関する勉強会を開催しました。 その中でタイミーフロントエンドエンジニアのいーふとさん（@redshoga）の講演をイベントレポートにまとめてお届けします。 今回のスピーカー Server Actionsの概要 ※ 2023年8月2日のイベント開催時点での情報であり、将来的に変わる、変わっている可能性があります。 Server Actionsはざっくり説明するとサーバーで動作するコードをあたかもクライアント上に記述できる機能です。コード下部のLikeボタン…

フロントエンド、またはクライアントサイドとは、ウェブサイトやウェブアプリケーションのユーザーが直接対話する部分のことを指します。 これは、ウェブページ上で見えるテキスト、画像、ボタン、フォーム、動画、リンクなど、ユーザーがブラウザで見ることができるすべての要素を含みます。 フロントエンドは、ユーザーがウェブサイトを使って情報を閲覧したり、操作したりするためのインターフェースを提供します。 フロントエンドの主な要素 1.HTML (HyperText Markup Language) HTMLはウェブページの構造を定義するための言語です。 テキスト、画像、リンク、フォームなどの要素を配置し、それ…

この記事について ２本指でピンチアウト、ピンチインで画面の拡大縮小する方法を無効化する方法 1. javascript側でDOMの要素にイベント発火時の処理を追加する場合 2. cssで制御する場合 １本指で画面をダブルタップして画面の拡大縮小する方法を無効化する方法 1: javascript側でDOMの要素にイベント発火時の処理を追加する 2: cssで制御する方法 最後に この記事について いいコードはいい心から 今回はスマホでwebアプリを動かす際の制御についてです。 人為的に画面が拡大縮小してしまう要因として主に２つ存在すると考えています。 ２本指でピンチアウト、ピンチインで画面の拡…

初めまして、株式会社アドグローブ ソリューション第三事業部の中野です。 新しいプロジェクトをスタートする際、どの技術やフレームワークを採用するかは大きな決断の一つです。 「どの技術やフレームワークを採用すれば良いのか・・・」 私自身、いつも凄く悩んでいるポイントです。

はじめに こんにちは、フロントエンドエンジニアの堀江（@nandemo_3_）です。 社内の生成AIハッカソンのネタを探しているときに、XでLCMを用いたリアルタイムお絵描きツールがいくつかあることを知りました。 その中でも、flowty-realtime-lcm-canvasが非常に導入しやすく、初学者のような自分にとって画像生成AIの学びのきっかけになると思い、今回紹介しようと思います。 ※注意：初学者のため、間違っていることがあるかもしれません。ご了承ください。 LCMとは LCM(Latente Consistency Model: 潜在的一貫性モデル)は2023月10月に論文が発表さ…

アソビューAdvent Calendar 2023の3日目（B面）のブログです。 こんにちは！ アソビューでフロントエンドエンジニアをしている野口です。 今回はShopifyのMultipass機能を使用している中で直面した課題とその対処法について紹介しようと思います。 はじめに 弊社では、アソビュー！に掲載されている遊びの中から厳選した体験を、家族や友人にプレゼントできるアソビュー！ギフトというサービスを展開しています。 そのアソビュー！ギフトはShopifyを利用してECサイトを構築しており、会員登録やログイン時にShopify Multipass機能を利用しています。 Multipass…

この記事は、トラストバンク Advent Calendar 2023の3日目です。 お疲れさまです。フロントエンドエンジニアの片柳です。 先日、トラストバンクからふるさと納税の控除額シミュレーションライブラリfurusato-tax-simulationがリリースされましたので、紹介と実装時に考えたことなどを紹介できればと思います。 www.npmjs.com なぜライブラリを作るのか トラストバンクが提供するふるさと納税サイト「ふるさとチョイス」では、2種類の控除上限額シミュレーションを提供しています。 「家族構成」「年収」から簡単に上限額を知ることができる簡易シミュレーション。 源泉徴収票…

（本記事は Yappli Advent Calendar 2023 （2枚目） の2日目の記事です！🎄📅） こんにちは！データサイエンティストの山本（ @__Y4M4MOTO__ ）です。 先日、プロダクト開発本部にてLT大会を開催しました！（遂に10回目です！✨） 今回はなんと取締役執行役員CTOのげんきさんが久々に発表者エントリー！！さらに、当日の飛び入りエントリーもあり、発表者と聴講参加者合わせて約 50 人もの方々にご参加いただきました！🙌 この記事では、当日の様子やその発表内容などについてご紹介します！ どんな大会？ 発表内容 PICK UP! 『ゴミの日リマインダー』 『植物を育て…

アソビューAdvent Calendar 2023の2日目の記事です。 みなさんこんにちは！ 長く続いた暖かい日も終わり、本格的な冬が訪れようとしているアドベントカレンダー2日目…暖かい日差しの中お出かけをするのもいいけど、寒い季節に暖かい格好で寒空の下外に出るのも乙だなあと思っております、アソビュー株式会社でフロントエンドエンジニアをしている櫻井と申します。 今回は輪読会を通して学んだ知見をプロダクト作りに生かす取り組みについて紹介させていただきたいと思います。 はじめに 輪読会について 本を選ぶ なぜこの本を挙げたのか 輪読会について 進め方 輪読会終了後 改善活動について 社内勉強会で報…

フロントエンドカンファレンス沖縄2023 2023/11/18 https://frontend-conf.okinawa.jp/ https://front-okinawa.connpass.com/event/299738/ Figmaプロトタイプ入門〜インタラクションイメージのつくりかた〜 株式会社necco / 中川 小雪 Figmaのプロトタイプ デザインを繋いで動きを確認できる 画面遷移を確認できる インタラクションも作れる 実機でデザインを確認できる URLの共有で顧客にプロトタイプを共有できる プライベートプロダクト戦略。Webアプリを起点にしたクロスプラットフォームで大企業が…

その昔、30歳目前のわたしが何より恐れていたのは、「使えない人間」になることだった。 「使える人間」でなくてもいいけど、「使えない人間」には、なりたくない。というか、使えない人間であることがバレたらどうしようと毎日気に病んで落ちこんでいた。 すがりつくように、本を読んだ。芸術的な要素のまるでない、今すぐ役に立ちそうな、効率的で生産的で実践的な本ばかりを。「フロントエンドエンジニア虎の巻」「プレゼンの極意」「パワーポイント大全」「マッキンゼーなんちゃら」といったようなものを、次から次に読んだ。そして、かたっぱしから忘れた。 どんなに本を読んでも、わたしの能力はまったく上がらなかった。出世もしなか…

この記事は、 KENTEM TechBlog アドベントカレンダー2023 1日目、12月1日の記事です。 初めまして。KENTEMでWEBフロントエンドエンジニアをしている千葉です。 TypeScriptは型を全く使わずに全てanyにすることもできる一方で、複雑な型関数を構築することもできるため、どこまで型を厳密にするべきか悩むことが多いです。 そこで今回は少し丁寧なReact × TypeScriptのコンポーネントのプロパティ型定義についてご紹介します。 ご紹介する型定義はinterfaceを使った代替表現がない点にご注意ください。 複数パターンの型を許容するプロパティを受けるコンポーネ…

はじめに みなさん、こんにちは。 ウェルスナビ株式会社で執行役員VPoEを務める和賀です。 開発者ブログ アドベントカレンダー1日目は、開発組織の設計・運営を管掌させていただいている私から、当社でのエンジニア向けキャリアについてVPoE目線でまとめてみたいと思います。 変革の時代におけるエンジニアキャリア エンジニアリングの世界は、生成AI やビッグデータなどの革新的な技術の登場により、劇的な変化を迎えています。 世界経済フォーラムの「未来の仕事レポート20231」によれば、今後数年間でビジネスの構造は大きく変化し、AIや機械学習の専門家、サステナビリティスペシャリストなどの職種が急成長すると…

ハロー、@seto_hi です。 この記事は株式会社エス・エム・エス Advent Calendar 2023の1日目の記事です。 qiita.com 自分は1年前からフロントエンドエンジニアとして働いており、最近はプロダクト開発と並行して、フロントエンド開発のテスト関連の方針を考えています。 テストのバランスについて考えた Unit testやIntegration testなどの各種テストのバランスについて、Testing pyramidとTesting trophyという有名な考え方があります。一見するとこの2つの考えは相反しているように感じ、どちらに従うべきか迷いました。調べていくうち…

はてなで働くエンジニアにアンケートシリーズ第24回は、MackerelチームのWebアプリケーションエンジニア、id:azukiazusaに話を聞きました。 お互いの技術力を高め合える環境で働きたいと思っていた チームではそれぞれの得意な領域でメンバーをサポートし合う アウトプットを推奨する文化があるので登壇に挑戦 Working Out Loudを実践して分からないことはどんどん発言 お互いの技術力を高め合える環境で働きたいと思っていた ── Q1. はてなidとその由来を教えてください id:azukiazusaです。由来は本名からです。同僚からは「あずきさん」と呼ばれていることが多いです…

株式会社エス・エム・エス Advent Calendar 2023 エス・エム・エスで開発者をしている @koma_koma_d です。 今年もアドベントカレンダーの季節ですね、ということで、今年はエス・エム・エスでもアドベントカレンダーをやります！ qiita.com 記事は、このブログ以外に、各メンバーの個人ブログ、Qiita、Zennなどの様々な媒体に投稿される予定です。公開された記事はXのアカウント @BM_SMS_tech で随時シェア予定ですので、ぜひアカウントをフォローしていただけると幸いです！ 誰が何を書くのか 参加するメンバーは、 開発者 SRE エンジニアリングマネージャー…