お知らせ connpassではさらなる価値のあるデータを提供するため、2024年5月23日(木)を以ちましてイベントサーチAPIの無料での提供の廃止を決定いたしました。
2024年5月23日(木)以降より開始予定の「connpass 有料API」の料金プランにつきましてはこちらをご覧ください。

お知らせ connpassをご利用いただく全ユーザーにおいて健全で円滑なイベントの開催や参加いただけるよう、イベント参加者向け・イベント管理者向けのガイドラインページを公開しました。内容をご理解の上、イベント内での違反行為に対応する参考としていただきますようお願いいたします。

このエントリーをはてなブックマークに追加

Mar

3

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編

華の節句にReactを学んでみませんか?

Organizing : LINE Developer Community

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編
Hashtag :#LINEDC
Registration info

参加枠1

Free

Attendees
189

Attendees
morisobaa
r3yamauchi
komeda
en-i
hiro1122
blue
ikuko-k
shakeisan
dafujii
ysakamoto14
View Attendee List
Start Date
2022/03/03(Thu) 19:00 ~ 22:00
Registration Period

2022/02/02(Wed) 15:00 〜
2022/03/03(Thu) 18:00まで

Location

オンライン

オンライン

参加者への情報
(参加者と発表者のみに公開されます)

Description

Youtube チャンネルへの登録よろしくおねがいします!

イベント概要

人気のフロントエンド技術であるReactやViteの使い方を学びながら、実用的なLINEミニアプリ(LIFFアプリ)開発のポイントを網羅できるハンズオンです。テンプレートを触りながらLINE APIの使い方を知り、自分で拡張してLINEミニアプリやサービスを爆速で作れるようになることが目標です。またフロントエンド技術の入門や、生産性の高いフロントエンド開発の習得にも役立ちます。LINEプラットフォームを通して、フロントエンドエンジニア必携の技術を学んでみませんか?

第1回は、React x LINE API の使い方にフォーカス。続編(4月予定)と合わせて、アプリを徐々に進化させながら、フロントエンド技術を学んでいきましょう。

使用技術:

  • LIFF(LINE Front-end Framework)
  • Typescript
  • React
  • Vite

こんな人におすすめ

  • LINE APIを生かしたWebアプリ開発に興味があるエンジニア
  • Reactを学びたいフロントエンド開発初心者
  • Viteなど開発生産性の向上ツールに興味のあるフロントエンドエンジニア

このイベントで学べること

  • テンプレートでLINE APIの使い方を知る
    • git cloneすればすぐ使える
    • 自分で拡張して、アプリ・サービスを作れるようになる
  • React x LINE API(LIFF) の使い方
  • Viteの使い方

タイムテーブル

時間 内容
18:55 Youtube配信開始
19:10 - 19:55 React (Vite) で LIFF アプリを作るハンズオン:環境構築
19:55 - 20:10 viteについて解説
20:10 - 20:15 コードについて解説
20:15 - 20:30 react hooksについて解説
20:30 - 20:40 LIFFについて解説
20:40 - 21:40 ハンズオン:チャレンジ課題
21:50 クロージング

※適宜休憩を取りながら進めますので、時間は目安となります。

参加URL

Youtube Liveで配信します。 参加URLは、お申込み後「参加者への情報」をご覧ください。

講師陣

内西 功一(4geru)

LINE API Expert
学生時代に、ハッカソンに参加していたら、気づいたらLINE API Expertになっていました。

LINE APIの面白いところを知ってもらおうと日々活動しています。

※完全に趣味でしているので、仕事との関係はありません。

Twitter : @_4geru
Github : @4geru

jiyuujin

  • 複雑なUIを作るのが好きです
    • React/Next/Vue/Nuxt/Scala/Swift
  • スタッフとして色々と参画中
    • FlutterKaigi 2021 / JAWS DAYS 2021 個人スポンサー / Flutter Japan User Group (Osaka) _ PWA night / v-kansai / kansai.ts

Twitter : @jiyuujinlab
Github : @jiyuujin
プロフィールサイト: https://yuma-kitamura.nekohack.me
技術ブログ: https://webneko.dev

河本貴史(もっちゃん)

LINE株式会社 テクニカルエバンジェリスト
Microsoft MVP(2021~)/LINE API Expert(3期生|2019~)/LINE Corp/テクエバ・DevRel/Azure Machine Learningが好き/著書『LINE API実践ガイド』/LINE、VS Codeコミュニティ オーガナイザ/エンジニアフレンドリーシティ福岡アワード2020受賞(LDGQ)

Twitter : @kawamoto_LINER

LINE Developer Community Zennについて

イベントの登壇内容をZennに一部記事化しています! 動画アーカイブよりさらに手軽に内容をおさらいできるので是非ご覧ください。 https://zenn.dev/linedc

コミュニティ行動規範(Code of Conduct)について

本コミュニティは参加する全ての方が不快な思いをすることなく、楽しんでいただくことを目的としております。 そのために、以下のような行為は禁止されております。

  • ヘイトスピーチ
  • 性的な言葉や画像、性別に言及したり、性別により受け取り方の変わる言葉や画像の使用
  • 侮辱や軽蔑的、中傷や他者を貶めるような発言
  • 他者のプライバシーや私的な情報の無許可での公開
  • その他多様性への配慮を著しく欠く発言や行動

ハラスメントを受けた、と感じた方は以下までご連絡下さい。
Twitter
E-mail

発表者

Feed

degapo

degapo wrote a comment.

2024/04/12 20:27

Sure! If you're diving into React x LIFF with a hands-on approach, incorporating the power of Vite for faster development is a smart move. Start by setting up your React project with Vite, leveraging its speedy bundling capabilities. Then, integrate LIFF into your React components, ensuring seamless interaction with LINE Platform features. Remember to optimize your development workflow by utilizing tools like https://ssstok.net/ for efficient asset management and deployment. This holistic approach will enhance your front-end strategy, empowering you to build robust LINE-integrated applications with ease.

coraki

coraki wrote a comment.

2024/04/11 19:14

It sounds like you're describing an event or workshop focused on front-end development strategy, particularly https://www.gizmogo.com/sell-game-consoles highlighting the use of React and LINE Front-end Framework (LIFF) with Vite. Participants can expect to gain practical experience in using React and Vite to build web applications that integrate with LINE's messaging platform through LIFF. The workshop may include tutorials, hands-on exercises, and discussions on front-end development strategies tailored to this specific technology stack.

coraki

coraki wrote a comment.

2024/04/11 19:05

It seems like you're describing an event or workshop focused on front-end development strategy, specifically targeting https://spotiapk.net/download-spotify-blue-mod-apk-updated-v8-6-82-1113/ the use of React and LINE Front-end Framework (LIFF) with Vite. In summary, this workshop likely provides participants with hands-on experience in using React and Vite to build web applications that integrate with LINE's messaging platform through LIFF. It may cover topics such as setting up a development environment, integrating LIFF functionality, and optimizing front-end performance.

coraki

coraki wrote a comment.

2024/04/11 19:01

It sounds like you're referring to a hands-on workshop or tutorial titled "First React x LIFF hands-on #1 React & Vite edition" focusing on front-end strategy. The overall focus of the workshop seems to be on leveraging React and Vite to build web applications that integrate with LINE's messaging platform using LIFF. Participants are likely to gain practical experience in setting up a React project with Vite, integrating LIFF functionality, and https://dudehubs.com/ building interactive web apps that interact with LINE's messaging services.

azuere

azuere wrote a comment.

2024/04/02 15:08

The Chrysler 300 https://www.autonationx.com/chrysler-300-years-to-avoid/ has been a popular full-size sedan known for its bold design and powerful performance, but like any vehicle, certain model years may have experienced more issues than others. While opinions on specific years may vary among car enthusiasts and experts, some consumers have reported concerns with the earlier models, particularly those produced between 2005 and 2007. During this period, there were occasional complaints about transmission issues and electronic problems. However, it's essential to note that the reliability of a specific Chrysler 300 can vary based on factors such as maintenance history and individual driving habits.

mijar

mijar wrote a comment.

2024/03/29 21:01

Incorporating React with LINE Front-end Framework (LIFF) presents an innovative approach for seamless web integration with LINE's messaging platform. Developers can leverage LIFF's capabilities to enhance user engagement and streamline interactions within LINE's ecosystem. Check out how React x LIFF collaboration transforms user experiences with this insightful tutorial: https://oldrollapk.com/disposable-camera-old-roll-mod-apk/

mijar

mijar wrote a comment.

2024/03/29 21:00

To kickstart your front-end strategy, consider integrating React with LINE Front-end Framework (LIFF) for a seamless user experience. By leveraging LIFF's capabilities within React applications, you can enhance functionality such as authentication, messaging, and payment services. Check out examples like http://sonicsmenu.com/ for inspiration on how to effectively combine React and LIFF to create dynamic and interactive web experiences.

mijar

mijar wrote a comment.

2024/03/29 21:00

Front-end strategy involves planning and executing the development of user-facing components and interfaces in web applications. In the context of React x LIFF (Line Front-end Framework), developers can leverage React's component-based architecture with LIFF's features for seamless integration of LINE's services into web applications. This collaboration enables innovative solutions for user engagement and interaction. For more information on utilizing React x LIFF, visit https://minimilitiamodapk.net for detailed insights and resources.

mijar

mijar wrote a comment.

2024/03/29 20:58

Incorporating React with LIFF (Line Front-end Framework) offers a powerful front-end strategy for building dynamic and interactive web applications. By leveraging LIFF's features alongside React's component-based architecture, developers can create seamless user experiences across LINE Platform and web interfaces. Explore innovative possibilities and streamline development with this cutting-edge approach. Discover more at https://buysemaglutideonlineuk.com/product/buy-rybelsus-uk/.

wacef

wacef wrote a comment.

2024/03/24 18:43

Explore the latest in front-end strategy with our hands-on workshop series, "First React x LIFF #1 React & Vite!" Join us as we delve into the world of React and Vite, uncovering innovative techniques and best practices for building modern web applications. Don't miss this opportunity to level up your front-end skills and stay ahead of the curve. Register now to secure your spot and embark on a journey of learning and discovery. For more information and to sign up, visit https://www.webuyanyhouseasis.com/.

wacef

wacef wrote a comment.

2024/03/24 18:38

Dive into the world of front-end development with our First React x LIFF hands-on workshop! Learn how to leverage React and Vite to build powerful and responsive user interfaces. Join us as we explore the latest front-end strategies and techniques, all while experiencing the seamless integration of LINE Front-end Framework (LIFF). Don't miss out on this opportunity to level up your skills and stay ahead in the rapidly evolving world of web development. Ready to take your front-end game to the next level? Register now and embark on your journey towards mastery! For more information, visit https://www.thaibulksms.com/sms-marketing/.

whenheliom45678

whenheliom45678 wrote a comment.

2024/03/17 20:55

Sprinkling positivity one post at a time Spreading smiles like confetti Living my best life, one adventure at a time Capturing memories and making them last forever Editing my world with a touch of magic " https://capcutapkonline.com/ '"

azuere

azuere wrote a comment.

2024/01/10 20:20

While it's important to note that opinions on the worst Nissan Versa model year may vary, there have been certain years that garnered criticism due to reported issues. The 2012 Nissan Versa https://www.autonationx.com/nissan-versa-years-to-avoid/ is often highlighted as a model year with significant problems. Owners and experts have pointed to issues such as transmission problems, particularly with the continuously variable transmission (CVT), which is known for issues like shuddering, slipping, and premature failure. Additionally, there have been complaints about the build quality, interior materials, and overall driving experience. It's crucial for potential buyers to thoroughly research and consider expert reviews as well as user feedback when evaluating any specific model year to make an informed decision based on the most up-to-date information.

azuere

azuere wrote a comment.

2024/01/06 19:57

It's important to note that the most common problems with a Toyota RAV4 can vary depending on the model year and specific vehicle conditions. However, one recurring issue reported by some RAV4 owners involves excessive oil consumption, particularly in certain model years. Some drivers have experienced higher-than-normal oil consumption rates, which could potentially lead to engine issues if not addressed promptly. It's crucial for RAV4 owners to stay informed about any recalls or technical service bulletins related to their specific model year and address issues promptly through regular maintenance and servicing.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/29 04:06

Embark on your front-end journey with the First React x LIFF hands-on experience, exploring the seamless integration of React with LINE Front-end Framework (LIFF). Dive into practical strategies for creating engaging and responsive user interfaces. For tailored insights and hands-on learning, visit https://tailormade-shirts.com/ – where front-end strategies meet customization for an optimal web development experience.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/29 04:04

Embarking on the journey of the first React x LIFF hands-on presents an exciting front-end strategy. By integrating the LINE Front-end Framework (LIFF), developers can create seamless and interactive web applications. Explore the potential of this strategy and stay tuned for a unique hands-on experience. Additionally, check out https://life2vecdeathcalculator.com/ for intriguing insights and tools related to life calculations.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:42

Embark on your React x LIFF journey with our hands-on #1 React & Vite edition tutorial, exploring the front-end strategy. Dive into the world of web development seamlessly, and don't forget to check out https://tokenmakerpro.com/ for additional resources and insights on optimizing your projects. Elevate your coding experience and stay ahead in the ever-evolving landscape of React and Vite.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:41

Exploring the front-end strategy with the first React x LIFF hands-on in the #1 React & Vite edition is an exciting journey into cutting-edge development. Dive into the React & Vite edition for hands-on experience and stay updated on the latest trends, including insights on Google Finance API integration discussed in detail at https://techworldstalk.blogspot.com/2023/12/google-finance-api-integration-and.html. Elevate your React skills with this comprehensive guide.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:40

If you could provide more context or clarify your request, I would be happy to assist you. Additionally, if you have any questions or need information related to the keyword "https://desherbantpuissant.com/," please specify, and I'll do my best to help.

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:39

Embark on your front-end journey with the First React x LIFF hands-on #1 React & Vite edition. This comprehensive guide will equip you with React and Vite skills to elevate your web development game. Don't miss the chance to explore this tutorial series for a robust front-end strategy. And for the latest insights into forex trading, visit https://forextradingindubai.com/. Happy coding!

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:38

Embark on your front-end journey with the First React x LIFF hands-on, specifically tailored for React & Vite enthusiasts. In this edition, we dive into the intricacies of front-end strategy, offering valuable insights and practical tips. Whether you're a seasoned developer or just starting, join us to enhance your React and Vite skills. And hey, don't forget to check out the latest at https://trucksimulatorultimatemodapk.com/ for a unique gaming experience!

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/12/24 02:36

Explore the exciting realm of front-end development with the First React x LIFF hands-on session, a comprehensive guide presented in the React & Vite edition. Uncover the power of React and Vite as you delve into this immersive experience. Elevate your skills and knowledge with valuable insights and practical application. Visit https://animly.com/ for additional resources and to stay updated on the latest trends and technologies in the world of development. Ready to embark on a journey of innovation and growth? Join us in mastering React and LIFF for a transformative front-end strategy.

Charlie2220

Charlie2220 wrote a comment.

2023/07/20 12:02

Thanks for sharing. <a href="https://capcuttemplates.org">https//capcuttemplates.org</a>

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/07/08 18:47

Tubidy Free MP3 emerges as an exceptional platform that caters to music enthusiasts worldwide. https://tubidy.su/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/07/05 19:45

Before getting started with React, you must have a basic understanding of HTML, CSS, DOM (Document Object Model), JavaScript, Node. https://starbuckspartnerhours.app/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/27 17:15

When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java https://youcineapk.pro/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/27 15:57

Hamdanglobal is best site where you get many important bussiness tips and ideas which will help you out definitely. You will get many services and jobs. For more information visit : https://hamdanglobal.co/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/26 21:01

"During the first React x LIFF hands-on session, we focused on front-end strategy and explored the React & Vite edition. We delved into various aspects of building user interfaces using React. Additionally, we had the opportunity to incorporate third-party libraries like Kushy Punch to enhance the functionality and experience of our applications." If you get more information so visit this link "http://kushypunch.co"

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/25 01:08

The first React x LIFF hands-on session, specifically the React & Vite edition, is focused on front-end strategy. While I don't have detailed information about the content covered in that specific session, if it's related to cryptocurrency trading, it's likely to involve building a front-end interface or application for cryptocurrency trading using React and Vite. This hands-on session could provide practical experience and insights into developing user interfaces and implementing functionalities specific to cryptocurrency trading platforms. If you get more information so visit this given link. "https://vfxalert.com/p/cryptocurrency-trading"

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/24 17:57

Watching live sports is an exciting and thrilling experience that brings fans together from all over the world. Whether you’re a die-hard fan of football, basketball, or any other sport, nothing beats being able to watch the game live as it happens. However, with so many different streaming options, knowing where to turn for the best quality and most reliable streams can be difficult. https://hesgoal.app/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/07 16:47

The tubidy free mp3 download is easy to use and you don't need to sign in to download your favorite songs. It is made for music lovers; this free music website lets you enjoy music in a special way whenever you want. With the website, you can find music, listen and, download songs for free so you can listen to them even without an internet connection. https://tubidy.bio/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/06/07 16:47

The tubidy free mp3 download is easy to use and you don't need to sign in to download your favorite songs. It is made for music lovers; this free music website lets you enjoy music in a special way whenever you want. With the website, you can find music, listen and, download songs for free so you can listen to them even without an internet connection. Search for millions of songs by their names and YouTube link.

MuhammadSohail

MuhammadSohail wrote a comment.

2023/05/11 17:05

When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java. https://geopard.tech/blog/topography-and-nutrition-content-in-soil-and-yield/

MuhammadSohail

MuhammadSohail wrote a comment.

2023/05/11 17:04

https://www.universalapk.com/zombie-frontier-4-mod-apk/ When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java.

MuhammadSohail

MuhammadSohail wrote a comment.

2023/05/11 16:58

When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java.https://geopard.tech/blog/topography-and-nutrition-content-in-soil-and-yield/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/05/11 16:49

When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java. Thanks Regards: https://linensrange.co.uk/product-category/kitchen-linens/

(退会ユーザー)

(退会ユーザー) wrote a comment.

2023/02/07 19:56

Before getting started with React, you must have a basic understanding of HTML, CSS, DOM (Document Object Model), JavaScript, Node. https://www.unilightled.com/fine-pixel-pitch-led/

MalikG

MalikG wrote a comment.

2023/02/01 02:19

Vite pre-bundles these dependencies using esbuild, which is 10-100x faster than JavaScript-based bundlers. "https://shakemods.com/"

MalikG

MalikG wrote a comment.

2023/02/01 02:18

Prerequisites. Step 1 — Creating a Vite Project. Step 2 — Starting the Development Server. Step 3 — Previewing Your App from Mobile Phone. Step 4 — Removing the Default Boilerplate. Step 5 — Creating a Basic App. Step 6 — Building for Production. Conclusion.https://spotifymod.com/

clarkjenifer33

clarkjenifer33 wrote a comment.

2023/01/05 00:57

When I was a student, I participated in a hackathon, and before I knew it, I had become a LINE API Expert. Now im an expert of all coding languages mainly java. Thanks Regards: https://bestgadgetshelp.com/best-sticker-printers-2022/

MuhammadSohail

MuhammadSohail wrote a comment.

2023/01/04 01:01

"Front-end strategy" is a method for estimating an answer to a calculation problem by focusing on the "front-end" or "left-most" digits of a number. Its strongest application is for addition. You buy a hamburger for $4.79, a drink for $1.26 and an ice-cream cone for $0.95. Will a five dollar bill cover the cost? https://plantsinsights.com/alocasia-nebula/

jiyuujin

jiyuujinさんが資料をアップしました。

04/11/2022 20:18

jiyuujin

jiyuujinさんが資料をアップしました。

03/11/2022 19:19

jiyuujin

jiyuujinさんが資料をアップしました。

03/04/2022 13:10

鍋島理人

鍋島理人さんが資料をアップしました。

03/03/2022 18:28

Ended

2022/03/03(Thu)

19:00
22:00

Registration Period
2022/02/02(Wed) 15:00 〜
2022/03/03(Thu) 18:00

Location

オンライン

オンライン

オンライン

Attendees(189)

morisobaa

morisobaa

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編に参加を申し込みました!

r3yamauchi

r3yamauchi

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

komeda

komeda

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

en-i

en-i

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

hiro1122

hiro1122

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編に参加を申し込みました!

blue

blue

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

ikuko-k

ikuko-k

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

shakeisan

shakeisan

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

dafujii

dafujii

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編 に参加を申し込みました!

ysakamoto14

ysakamoto14

フロントエンド攻略!はじめてのReact x LIFFハンズオン #1 React & Vite編に参加を申し込みました!

Attendees (189)

Canceled (11)