サービス

技能：エンジニア

技能：デザイナー

技能：ビジネス職

技能：バックオフィス

ジャンル

<p>こんにちは！「Think ! FrontEnd」運営の三浦です。日ごろはアルファ室という部署にて全社横断的なプロジェクトのPMを担当しています。最近は一部の技術勉強会・イベントで企画や運営にも携わっています。<br />
先日9/12(火)に開催された「<a href="https://dmm.connpass.com/event/291641/" target="_blank">Think! FrontEnd by DMM #05 新卒回</a>」について紹介します。</p>

<h2>Think ! FrontEnd とは？</h2>

<p>「Think ! FrontEnd by DMM」は、DMM Group のフロントエンドおよびJavaScriptにおける開発現場の【今】を話しながら、皆であらためてフロントエンドやJavaScriptのことを考えようという趣旨で立ち上げたコミュニティです。</p>

<p>約2年ぶりの開催に伴って、社内のデザイナーに協力いただき、キービジュアルの刷新と、運営初の試みとなるOBS&nbsp;<span style="font-size:10.5pt; font-variant:normal; white-space:pre-wrap"><span style="font-family:Arial,sans-serif"><span style="color:#000000"><span style="font-weight:400"><span style="font-style:normal"><span style="text-decoration:none">Studio</span></span></span></span></span></span>でのライブ配信を実施しました。また今回は「新卒回」と題して、22・23新卒エンジニアのフレッシュなメンバーによる登壇と、DMMの新卒研修体験談や入社後のキャリア、目標についてパネルディスカッションを実施しました。</p>

<p>当日の様子についてはYouTube Liveのアーカイブがありますので、リアルタイムで見れなかった方はぜひそちらをご覧ください！</p>

<div>
<div class="youtube-embed-wrapper" style="position:relative;padding-bottom:56.25%;padding-top:30px;height:0;overflow:hidden"><iframe allowfullscreen="" frameborder="0" height="480" src="https://www.youtube-nocookie.com/embed/b8ofeP9x0Bc?rel=0" style="position:absolute;top:0;left:0;width:100%;height:100%" width="640"></iframe></div>

<p>&nbsp;</p>
</div>

<h2>Next.js&times;Prisma&times;GraphQL&times;Supabase(+WASM)でブログを自作した話</h2>

<p>1人目は、23年新卒で入社された動画配信開発部の大坂さん(<a href="https://twitter.com/yud0uhu" target="_blank">@yud0uhu</a>)による登壇で、Next.jsやPrismaなどモダンなスタックで構築した個人ブログについてのお話でした。</p>

<div data-oembed-url="https://speakerdeck.com/yud0uhu/next-dot-jsxprismaxgraphqlxsupabase-plus-wasmdeburoguwozi-zuo-sitahua">
<div>
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.1972%;"><iframe allowfullscreen="" scrolling="no" src="//if-cdn.com/bSClDJv" style="top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;" tabindex="-1"></iframe></div>
</div>
</div>

<h2>ドラッグ＆ドロップを支える技術</h2>

<p>2人目は、23年新卒で入社されたオンラインサロン開発部の高津さんによる登壇で、Web上でのドラッグ&amp;ドロップ機能をDOM操作やCanvasでどのように実装するかという内容でした。</p>

<div data-oembed-url="https://speakerdeck.com/takatsunobuhiro/doratugu-and-dorotupuwozhi-eruji-shu">
<div>
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.1972%;"><iframe allowfullscreen="" scrolling="no" src="//if-cdn.com/wXumrNH" style="top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;" tabindex="-1"></iframe></div>
</div>
</div>

<h2>新卒研修でNext.js AppRouterを導入した学びと反省</h2>

<p>3人目は、23年新卒で入社されたライブコミュニケーション開発部の井内さん(<a href="https://twitter.com/pengin_engineer" target="_blank">@pengin_engineer</a>)による登壇で、Next.js 13で追加されたAppRouterを新卒研修のチーム開発に導入した際の学びと反省についてのお話をされていました。</p>

<div data-oembed-url="https://speakerdeck.com/iuchimasatoshi/xin-zu-yan-xiu-denext-dot-js-approuterwodao-ru-sita-xue-bitofan-sheng">
<div>
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.1972%;"><iframe allowfullscreen="" scrolling="no" src="//if-cdn.com/WK8U5kp" style="top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;" tabindex="-1"></iframe></div>
</div>
</div>

<h2>純SPAでNext.jsに対抗する 〜ページによってmetaタグを切り替える編〜</h2>

<p>最後は、22年新卒でプラットフォーム事業部ポイントクラブグループの清川さん(<a href="https://twitter.com/kiyoshiro944" target="_blank">@kiyoshiro944</a>)による登壇で、CSRのみ純SPAアプリでmetaタグをページによって切り替える実装方法について発表されていました。</p>

<div data-oembed-url="https://speakerdeck.com/kiyoshiro/chun-spadenext-dot-jsnidui-kang-suru-peziniyotutemetataguwoqie-riti-erubian">
<div>
<div style="left: 0; width: 100%; height: 0; position: relative; padding-bottom: 56.1972%;"><iframe allowfullscreen="" scrolling="no" src="//if-cdn.com/ViZEnW3" style="top: 0; left: 0; width: 100%; height: 100%; position: absolute; border: 0;" tabindex="-1"></iframe></div>
</div>
</div>

<h2>パネルディスカッション</h2>

<p>パネルディスカッションでは、DMMの新卒研修や今後のキャリア・目標について語ってもらいました。さまざまな観点から登壇者の意見交換が行われ、有意義な時間となりました。気になる方はぜひ、<a href="https://www.youtube.com/watch?v=b8ofeP9x0Bc&amp;list=PLm15VchDT7_8H9713i8joI2Ic762W08WK&amp;index=2&amp;t=4117s" target="_blank">アーカイブ</a>をご覧ください。</p>

<h2>おわりに</h2>

<p>Think ! FrontEndはこれからも定期的に開催を続けていく予定です。次回も楽しみにしていただければと思います！</p>

<p>最後にDMM Groupではフロントエンドを含めさまざまな職種で一緒に働いてくれる仲間を募集しています。ご興味のある方は、ぜひ募集ページをご確認ください！</p>

<p><a href="https://dmm-corp.com/recruit/" target="_blank">採用情報｜DMM Group</a><br />
<a href="https://dmmgames.co.jp/recruit/" target="_blank">採用情報｜DMM GAMES</a></p>


フロントエンド

イベント

新卒

Think! FrontEnd #5 新卒回 を開催しました！

プラットフォーム開発本部

facebook

twitter

DMM TV

DMMブックス

DMM pictures

DMM GAMES

DMMオンクレ

DMMスクラッチ

DMMくじ

DMM Factory

ぷらさぷ ～＋SURPRISE～

DMMオンラインサロン

DMMいろいろレンタル

DMM DVD／CDレンタル

DMM通販

DMMオンラインクリニック

デジタルコミック事業

DMMチャットブースト

DMM英会話

DMM FX

DMMかりゆし水族館

ベルリング

ハッシャダイソーシャル

ヤンキーインターン

シント=トロイデンVV

DMM 地方創生

DMM.make 3Dプリント

DMM.make PRODUCTS

Seamoon Protcol by DMM Crypto

DMMバヌーシー

DMM EV ON

DMM WEBCAMP

DMMぱちタウン

DMM競輪

Waitinglist

Algoage

DMMポイントクラブ

社会課題

エンターテインメント

動画

電子書籍

アニメ

ゲーム

アプリゲーム

コミュニティ

オンラインサロン

PCゲーム

通販

オンラインイベント

ビジネスソリューション

教育

英会話

水族館

ハードウェア・プロダクト

救急車両

消防車両

モノづくり施設

サッカー

スポーツ

地方創生

VR体験

Web3

生成AI

研究開発

アプリ

ブロックチェーン

プラットフォーム

横断開発

社会インフラ

アミューズメント

ダイバーシティ

同人

サーバサイド

バックエンド

ネットワーク

セキュリティ

ITインフラ

配信基盤

ペイメント

Android

データベース

ビッグデータ

データ分析

機械学習（ML）

MLOps

VR開発

フルスタック

プロトタイピング

グラフィックデザイン

イラスト作成

3DCG

モーショングラフィック

プロダクトデザイン

Think! FrontEnd #5 新卒回を開催しました！

シェア

関連する求人

関連する記事

Think! FrontEnd #5 新卒回 を開催しました！

シェア

関連する求人

関連する記事

Think! FrontEnd #5 新卒回を開催しました！