SESSION

フロントエンドのエンジニアや、マークアップ、デザインなど幅広いテーマの登壇内容を集めたセッション構成でお送りします

  • 11:10〜11:30 JavaScript

    フロントエンド開発における課題を問い直す

    技術選定や設計というのは「流行っているから」という理由で選定するのではなく、今後発生しうる課題を事前に防ぐために行うべきものです。本セッションでは、様々なフロントエンドに関わる技術を学ぶ上で、まず現代のフロントエンド開発においてどのような課題が発生しうるのかを改めて問い直して理解し、その課題から今使われている技術を見ることで今後の技術選定の助けや新たな技術を学ぶきっかけになるような話をしたいと思います。

    arakaki_san

    株式会社 Payke

    あらかき ゆうじ

    • Twitter

    沖縄ではたらくスタートアップのソフトウェアエンジニア。JavaKuecheとJAZUG沖縄という2つのコミュニティを運営。

  • 11:10〜11:30 React.js

    バックエンドエンジニアがReactとVueを学んで見えてきたこと

    Railsで大量のウェブサービスを作ってきた私がReactとVueを学んで体感した、エンジニア目線での「バックエンドとフロントエンドの違い」について話をします。 チーム開発でコミュニケーションが上手くいかない方や、バックエンドとフロントエンドの世界が全く違うように思えてフルスタックエンジニアへの第一歩を踏み出せない方へのアドバイスになれば幸いです。

    kaneshiro_san

    株式会社JidocaTechnologies CEO / 株式会社高専キャリア教育研究所 CTO

    兼城 駿一郎

    • Twitter

    沖縄県出身。 高専を経てリクルートに新卒入社後、開発組織の立ち上げや新規事業開発・ベンチャー買収等を担当。 リクルート在籍中にSNS分析のスタートアップを創業し、資金調達・黒字化を達成。 現在は複数のスタートアップで技術顧問・事業創出支援を行いつつ、全国の高専生向けキャリア教育事業を行っています。

  • A-1 11:30〜11:50 Design

    グリッドシステムを使用するためのヒント

    グリッドシステムは、RWD Webページレイアウトの主要な構造です。 初心者がグリッドシステムをより速く習得できるように、グリッドシステムを実際に使用する際のヒントとスケッチで使用するツールを紹介します。

    kelly_san

    Fontech UI/UX Designer

    Kelly Tung

    2012年にデザイナーとしてのキャリアをスタートさせ、デザイン案件にフォーカスしたFontechを設立しました。 2018年に、自社プロダクトStartingPointの開発を開始しました。デザインヘッドを務める過程で、デザイナーとしての学びを通して教えることにも情熱を燃やしました。2017年に、私はスケッチ台北のAmbassdorとして、より多くのデザイナーの経験をコミュニティに発信し、サービスの価値を生み出し、幅広い年齢層にテクノロジーがもたらす便利さを知っていただくことになりました。

  • B-1 11:30〜11:50 GAS

    あなたの知らないGAS（Google Apps Script）の世界

    GASを「単なるVBAマクロの延長」と思っていませんか？ ひと昔と違って、今やGit管理できるし、Vue.jsを使ったWebアプリも作れるし、ECMAScript構文も使えたりします。 社内での活用事例が目立つGASですが、ここではあまり取り上げられることのない自社サービスや受託開発の事例を紹介しながら、 GASの魅力についてお伝えできればと思います。

    xinsuzki_san

    GONENGO LLC / Kansai GAS Lab / Okinawa GAS Lab

    Xin Suzuki

    • Twitter

    司会もできるエンジニア。修士（都市政策）。大阪在住。 現職では中小企業・スタートアッパーの技術支援や端技術活用支援に取り組み、2019年に主催したイベントは600本を超える。創設コミュニティの大阪駆動開発は、日本マイクロソフト株式会社より「コミュニティに対する貢献賞」受賞。

  • C-1 11:10~13:10 Angular

    Angular実践入門ハンズオン

    簡単なアプリ作成を通してAngularの基本を体験できるハンズオンセッションです。作るのは単純なTodoアプリですが、速い人ならUIフレームワークの導入やFirebaseを使ったデータ永続化まで体験できます。セッション途中からの参加も大歓迎です。皆さんとコミュニケーションをとりながら楽しく時間を過ごせればと思っています！

    参加資格：
    npmまたはyarnを扱うことができる

    事前準備：
    最低限、npmコマンドを実行できる開発環境をご用意ください。
    それ以外は特に準備不要です。Angularのインストールも含めてすべての手順を本編で体験していただきます。

    tatsukichi_san

    フリーランス

    たつきち

    • Twitter
    • Facebook

    株式会社カルテットコミュニケーションズ元創業CTO。同社では8年間で売上規模5000万円→27億円、従業員数2名→60名という急成長に経営者として貢献。ゼロから自社サービスとその開発組織を立ち上げる。個人としても勉強会やカンファレンスでの登壇多数。著書に「基本からしっかり学ぶ Symfony2入門」（副著）。現在はフリーランスエンジニアとして活動中。

  • A-2 11:50〜12:10 microCMS

    SSR/CSR/SSGの動向2020

    Webサイトの構築手法はここ数年で劇的に変わりつつあります。 SSR（サーバーサイドレンダリング）、CSR（クライアントサイドレンダリング）、SSG（スタティックサイトジェネレート）についてそれぞれのメリット/デメリットを理解し、 最適な手法を選択していくことが重要です。 事例も交えて解説します。

    shibata_san

    ウォンタ株式会社

    柴田 和祈

    • Twitter

    慶應義塾大学を卒業後、ヤフー株式会社にデザイナー入社。広告事業に約5年半従事し、フロントエンドエンジニアとしても経験を積む。ReactやVueといったSPA開発が得意。 2017年にウォンタ株式会社を共同創業し、現在はmicroCMSの開発がメイン。著書「React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで 」

  • C-2 14:00〜16:00 microCMS

    microCMSワークショップ
    microCMS + NuxtでJamstackブログを作ってみよう

    参加資格：
    npmまたはyarnを扱うことができる

    事前準備：
    https://ja.nuxtjs.org/guide/installation/
    1. create-nuxt-appを利用し、Nuxtの雛形を事前に用意（※途中の質問にあるサーバサイドのフレームワークはNoneを選択する）
    2. npm run devコマンドでlocalhost上でサイトが見られるところまでやっておく

    https://microcms.io
    3. アカウント登録、ログインを事前に済ましておく

    shibata_san

    ウォンタ株式会社

    柴田 和祈

    • Twitter

    慶應義塾大学を卒業後、ヤフー株式会社にデザイナー入社。広告事業に約5年半従事し、フロントエンドエンジニアとしても経験を積む。ReactやVueといったSPA開発が得意。 2017年にウォンタ株式会社を共同創業し、現在はmicroCMSの開発がメイン。著書「React入門 React・Reduxの導入からサーバサイドレンダリングによるUXの向上まで 」

  • A-312:30〜12:50 Nuxt.js

    フロントエンドエンジニアのためのFirebaseサーバーレス開発徹底解説

    これまで様々な開発案件でFirebaseを用いたサーバーレス開発を実践してきた経験をもとに、以下のポイントを徹底解説します。
    ・Firebaseで何ができるのか？
    ・Firebaseで簡単ユーザー認証。
    ・CloudFunctionsでもっと柔軟にサーバーレス開発。
    ・NoSQLデータベースの設計パターン解説。
    ・Firebase開発におけるアクセス権限などの注意点。

    nishi_san

    株式会社OneSmallStep

    Nishi Takeshi

    • Twitter

    株式会社OneSmallStep代表取締役CTO。 福岡のシステム会社でプログラマーとして9年間勤務後、フリーランスとして独立。 その後複数のスタートアップ企業で取締役CTOを務め、2020年4月7日緊急事態宣言が発表された日に株式会社OneSmallStepを設立。 自社サービスと受託開発で主にフロントエンドの開発を担当。 Firebaseが好き。

  • B-3 12:30〜12:50 Design

    明日から使える！ ノウハウ・テクニックまとめ

    UI、UX、HTML、CSSなどについて「明日から使える」初歩のテクニックやノウハウをいくつか紹介します。

    ・UXとは画面遷移。Web屋さんはまずはこの理解でOK
    ・本1冊買えばOK！ 日本語の表記の鉄板ルール
    ・CSS - display: flex; / display: grid; の最初に覚えるパターン
    ・CSS - calc()の使い方
    ・SVGの使い方
    などなど..

    daichi_san

    デザイナー

    新垣 雄一郎

      高専→美大→株式会社レキサス入社。 エンジニアと組んだWebサービス開発が主な仕事で、UX設計・UIデザイン・フロントエンド実装を中心に「デザイン周り全部」を担当することが多い。HCD-Net認定 人間中心設計スペシャリスト。新型コロナ自粛期間はteratailのユーザーランキング100位を目指して活動していました。

    • A-4 12:50〜13:10 Nuxt.js

      Nuxt.jsプロジェクトの改善テクニック

      Nuxt.jsで構成されたプロダクトのリファクタリング・改善を行った経験から、Nuxt.jsプロジェクトを改善する際の設計や実装のテクニックについてお話しします。

      daichi_san

      CBcloud株式会社

      宮脇 駿

        2016年に茨城大学大学院を卒業後、株式会社NTTデータイントラマートにて自社パッケージ製品のフロントエンド開発などに従事。2020年からはCBcloud株式会社に参画。自社サービスSmaryuTruckを中心に、複数プロジェクトの開発で主にフロントエンドを担当

      • B-4 12:50〜13:10 JAMstack

        WordPressサイトをNuxt.js × microCMSのJAMstack構成にリニューアルした話

        3000ページ超えのWordPressサイトを、Nuxt.jsの静的HTML生成 × microCMS × NetlifyのJAMstack構成でリニューアルした事例から、

        ・実際にJAMstackで作ってみてどうだったのか
        ・従来のウェブサイト構築との開発体験の違い
        ・microCMSの使用感
        ・実装の注意点や苦労したポイント

        などをお話します。

        daichi_san

        株式会社TAM

        菅家 大地

        • Twitter

        Webコンサルティング会社のデザイナーを経て株式会社TAMのフロントエンドエンジニアに。 大手企業のWebサイトやアプリのフロントエンドの開発業務に従事。2019年3月に宮城県に移住。PWA Nightの他、仙台のフロントエンドコミュニティの運営に携わっている。

      • A-5 14:00〜14:20 React.js

        Next.js Storybook Driven Development

        準備中

        tejima_san

        GAOGAO Pte. Ltd.

        手島 拓也

        IBM研究所とLINE株式会社にて計7年エンジニアを経験。その後、シンガポール本社UPSTAY Ptd. Ltd.の共同創業者兼CTOとして起業、2年間で8個のプロダクトを開発し、うち１つを事業売却。 現在はGAOGAO Ptd. Ltd.の代表として東南アジア拠点のスタートアップ・スタジオの経営者兼エンジニアをしている。書籍「Vue.js入門」共著。

      • B-5 14:00〜14:20 PWA

        実践PWA 2020

        数年前からWebのトレンドとなっているProgressive Web App（PWA）。名前は知っていても実際のプロジェクトに導入できていないことも多いと思います。PWAを導入したい方、動向が気になる方向けに解説します。
        ・PWAで何ができるのか
        ・PWA実装の入門編
        ・クライアントワークでの導入の仕方・事例紹介

        chinen_san

        株式会社TAM

        まぁし/知念 昌史

        • Twitter

        沖縄出身。大学卒業後に上京、美容師になる。2011年にWeb業界へ転職し、未経験エンジニアとしてTAMに入社。大手企業のWeb/アプリ開発に従事。2019年に東京チーム在籍のまま沖縄移住、リモートでフロントエンド開発・エンジニア教育を担当。大規模サイトやPWA、CSS設計、CMSが得意。東京でPWA Night、沖縄でv-okinawaのコミュニティを運営。

      • A-6 14:20〜14:40 Flutter

        Flutterを使ったアプリ開発

        アプリ開発で使ったライブラリの紹介や所感について。

        kelly_san

        株式会社Never

        shohei

        Never Inc. CEO & Engineer.
        https://github.com/hukusuke1007

      • B-6 14:20〜14:40 フロントエンド

        フロントエンドのエコシステム

        現在のフロントエンド開発には様々な側面のエコシステムがあり、それらがWebアプリの開発やOSSを支えています。 本セッションでは、フロントエンドにおけるエコシステムに焦点を当てて、いくつかのエコシステムの役割や使い方を説明します。 今後のフロントエンド開発で、エコシステムをうまく活用するきっかけになればと思います。

        tomatsu_san

        サイボウズ株式会社

        外松 俊尚

        • Twitter

        新卒でサイボウズ株式会社に入社後、プロダクト開発を担当したのち、現在はフロントエンドエキスパートチームとして活動している。 社内ではプロダクト横断でフロントエンドの開発や支援を行っている。 DX（開発体験）が向上するようなツールやライブラリが好き。 現在は、愛媛県に移住して、のんびり暮らしています。

      • A-7 14:40〜15:00 flutter

        flutter入門

        flutter初心者でもわかりやすく、簡単なアプリを作るまでの話をします。例えば、UI宣言やホットリロードなど便利機能の使い方などもお話します。

        suzuki_san

        株式会社Re:Build

        カンボ

        株式会社フルスピードにwebエンジニアとして入社。フルスピードでは、大規模な広告配信サービスの管理画面開発を担当し、サーバサイドからフロントエンドまで幅広い開発に従事。フリーランスエンジニアとして1年ほど活動後、2017年11月に沖縄で起業し、株式会社Re:Buildを設立。東京と沖縄の企業様からの受託開発案件を請け、複数プロジェクトのプロジェクトマネージャーを経験。自社サービス「Tadoru」ではプロダクトマネージャーとして立ち上げから、シードの資金調達までを経験。

        • Twitter
        • Facebook

      • B-7 14:40〜15:00 マネジメント

        リモートワークでモブプログラミングを上手くやる3つの方法

        皆さんはリモートワークでどのように開発していますか？物理的に離れていたらペアプロやモブプロは無理と諦めていませんか？ 外出自粛になったReact/Flutterアプリ開発チームがリモートワークでもモブプロを上手くやるために行なった取り組みについて話します。 こんな人におすすめ：リモートワークでも「半分の時間で倍の成果」を出したい人

        daichi_san

        フリーランス

        いわむー

        • Twitter

        ITエンジニア/スクラムマスター
        青年海外協力隊でフィリピンへ赴任、コンピュータ技術を指導。2010年に沖縄移住、制御系システムの運用開発チームを牽引。2019年よりKDDI DIGITAL GATE沖縄にてフロントエンド開発を担当（React/Flutter） アジャイル開発コミュニティ「アジャイルゆいまーる」運営。沖縄ヨガ協会/インストラクター修行中。

      • A-8 15:10〜15:30 Adobe XD

        AdobeXDで実現するチームにやさしいUIデザイン

        現在自分が担当している、沖縄のテイクアウトアプリ「FastPick」のUIデザイン制作を事例に、初めての方でも簡単に使えるUI/UXデザインツール「AdobeXD」の活用方法やコツをお話しします。 デザイン作成の裏側や、エンジニアさんとのコミュニケーション方法についても少しご紹介。

        midorima_san

        フリーランス

        緑間 なつみ

        • Twitter

        2011年よりWeb制作会社でデザイナーとしてキャリアをスタート、沖縄移住をきっかけにフリーランスのディレクター/デザイナーとして独立。 沖縄県ではスタートアップ企業のサービスを中心に、UX/UIをはじめデザイン全般に携わっている。 その他、沖縄県のデザインコミュニティ「D#」運営、XDUG沖縄代表、個人的にXD初心者講座などのイベント企画、開催をしている。

      • A-9 15:40〜16:00 JAMstack

        あなたのWordPressサイトをJAMstackにする話

        JavaScriptとAPI + Markupで静的なウェブサイトを作る技術スタックとして「JAMstack」というワードが広まりつつあります。 しかし、サイトの管理者やコンテンツのライターにとってWordPressなどの慣れたCMSを手放すのは勇気がいる選択です。 ここでは、WordPressでコンテンツを管理しながら、JAMstackなフロントエンドを作る方法を紹介します。

        okamoto_san

        株式会社デジタルキューブ

        Hidetaka Okamoto

        Developer of TypeScript application
        React / NestJS / AWS CDK / Alexa

        AWS Samurai 2017
        Alexa Champions

      • A-10 16:10〜16:30 CSS

        Tailwind - what is the utility-first CSS framework
        Tailwind-ユーティリティファーストのCSSフレームワークとは

        Tailwind is a utility-first css framework, it gets a lot attention from F2E developers. Instead of pre-styled UI components, Tailwind focuses on utility classes, which lets you build a true sense of custom websites. This session will talk about why it is popular and how to utilize it and where is the most useful resource of it.
        Tailwindはユーティリティファーストのcssフレームワークであり、F2E開発者から多くの注目を集めています。 Tailwindは、事前にスタイル設定されたUIコンポーネントの代わりに、カスタムウェブサイトの真の意味を構築できるユーティリティクラスに焦点を当てています。 このセッションでは、なぜそれが人気があるのか、それをどのように利用するのか、どこでそれが最も役立つのかについて話します。

        chris_san

        OIST / 沖縄科学技術大学院大学

        Chris Wu

        • Twitter

        Chris is former Drupal groups leader, entrepreneur, designer and speaker coming from Taiwan. He is a open-source contributor, recently joined CODE for OKINAWA and contributed to the 沖縄県新型コロナウイルス対策サイト.
        クリスは台湾出身の元Drupalグループのリーダー、起業家、デザイナー、スピーカーです。 彼はオープンソースの貢献者であり、最近、CODE for OKINAWAに参加し、沖縄県新型コロナウイルス対策サイトに貢献しました。

      TOPページに戻る
      pagetop