Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
react-native-ffmpegを使って動画をいじくりmawasou
Search
Yu Watanabe
October 02, 2021
Programming
0
920
react-native-ffmpegを使って動画をいじくりmawasou
react-native-ffmpegについて
Yu Watanabe
October 02, 2021
Tweet
Share
More Decks by Yu Watanabe
See All by Yu Watanabe
Bolt 🤝 Expo
watanabeyu
0
320
npm packageとリリースとモノレポ
watanabeyu
0
64
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.1k
gandhの紹介です
watanabeyu
0
34
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
650
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
watanabeyu
4
1.2k
react-native-unimodulesのススメ
watanabeyu
1
6.5k
JavaScript製npmパッケージをTypeScriptで書き直した話
watanabeyu
0
1.1k
React Native Expoで行うアプリの簡単最速運用
watanabeyu
0
330
Other Decks in Programming
See All in Programming
新世界の理解
koriym
0
110
Terraform やるなら公式スタイルガイドを読もう 〜重要項目 10選〜
hiyanger
10
2.6k
The Niche of CDK Grant オブジェクトって何者?/the-niche-of-cdk-what-isgrant-object
hassaku63
1
730
Workers を定期実行する方法は一つじゃない
rokuosan
0
140
Amazon Q CLI開発で学んだAIコーディングツールの使い方
licux
3
140
MCP連携で加速するAI駆動開発/mcp integration accelerates ai-driven-development
bpstudy
0
220
AIコーディングエージェント全社導入とセキュリティ対策
hikaruegashira
15
9.1k
「次に何を学べばいいか分からない」あなたへ──若手エンジニアのための学習地図
panda_program
3
690
DataformでPythonする / dataform-de-python
snhryt
0
130
React は次の10年を生き残れるか:3つのトレンドから考える
oukayuka
41
16k
kiroでゲームを作ってみた
iriikeita
0
120
AIに安心して任せるためにTypeScriptで一意な型を作ろう
arfes0e2b3c
0
320
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.2k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
26k
Become a Pro
speakerdeck
PRO
29
5.5k
Intergalactic Javascript Robots from Outer Space
tanoku
272
27k
Designing Experiences People Love
moore
142
24k
Art, The Web, and Tiny UX
lynnandtonic
301
21k
Embracing the Ebb and Flow
colly
86
4.8k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
139
34k
Docker and Python
trallard
45
3.5k
Java REST API Framework Comparison - PWX 2021
mraible
31
8.7k
How GitHub (no longer) Works
holman
314
140k
Done Done
chrislema
185
16k
Transcript
2021/10/02 ΘͨͳΏ͏ REACT-NATIVE-FFMPEGΛͬͯ ಈըΛ͍͘͡Γճͦ͏
▸ ಈըΛฤू͢ΔΑ͏ͳΞϓϦΛ࡞Ζ͏͔ͳͱߟ͍͑ͯΔਓ ຊεϥΠυͷλʔήοτ
▸ ࣗݾհ ▸ ·ͱΊ ࣍
ࣗݾհ ΘͨͳΏ͏ גࣜձࣾg&h CTO + ଞͷ͓ख͍ Twitterɿ@hmktsu GitHubɿ@watanabeyu
࡞͍ͬͯΔαʔϏε ▸ ಈըΛݟͳ͕ΒϝϞ͕ॻ͚ΔΞϓϦROLL (ۙʑެ։༧ఆ) ▸ μϯεͦͷଞ֤छεϙʔπͳͲͰͬͯΒ͍͍ͨ ▸ ͷಈըΛબͯ͠ΞϓϦʹอଘ͢Δܗࣜ ▸ ศརͳϓϨΠϠʔػೳ
▸ όοΫΞοϓػೳFirebaseΛͬͯߏங ▸ ϚʔέςΟϯά༻్ͱͯ͠ͷಈըҰ෦Γൈ͖ػೳ ▸ ಈըΓൈ͖ػೳಈըΛ͍͘͡ΔػೳΛࠓޙఏڙ༧ఆ ▸ Bare Work fl ow(react-native-unimodules)Ͱߏங ಈըͷΓൈ͖͍͘͡Δʹʁ ͱ͍͏͜ͱΛຊհ
ຊͷςʔϚ react-native-ffmpegΛͬͯಈըΛ͍͘͡Γճͦ͏
ಈըΛ͍͘͡Δཧܥ ▸ iPhoneͷΧϝϥϩʔϧͷΑ͏ͳܗ ▸ ࿐ޫௐ৭ௐͳͲ͍Βͳ͍ ▸ ࣌ؒͷτϦϛϯά͕Ͱ͖ΕΑ͍ ▸ Ξοϓϩʔυ࣌ʹը֯(εέʔϧ)ΛมߋͰ͖ΔͱΑ͍ ▸
iOS/Android྆ରԠ͍ͨ͠ ▸ ӈͷΑ͏ͳը໘࠷ѱࣗͰ࡞͍͍ͬͯ
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg ɾࡱӨΛऔಘͰ͖ͳ͍ ɾΦϦδφϧͷID͕औಘͰ͖ͳ͍ ɾAndroidͰͷτϦϛϯά͕Ͱ͖ͳ͍
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg ɾॲཧ͕ॏ͍ɺࣗ༝͕͍
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg ɾಋೖ͕໘ɺΦʔόʔεϖοΫ
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg ɾฤूը໘͋Δ͕ɺ͓͕͔͔ۚΔ…
ಈըΛ͍͘͡ΔϥΠϒϥϦͷબࢶ ▸ expo-image-picker ▸ react-native-image-picker ▸ react-native-image-crop-picker ▸ react-native-video-helper ▸
react-native-video-processing ▸ vesdk-react-native ▸ react-native-ffmpeg ffmpegΛ͍׳Ε͍ͯΔ + ಋೖҙ֎ͱ؆୯ ฤूը໘؆୯ʹࣗͰ࡞Ε͍͍
REACT-NATIVE-FFMPEGͰΑ͘͏Ͱ͋Ζ͏ίϚϯυ ϑΝΠϧͷίϐʔ
REACT-NATIVE-FFMPEGͰΑ͘͏Ͱ͋Ζ͏ίϚϯυ ઌ಄10ඵ͚ͩΓൈ͍ͯɺԣ320pxʹεέʔϧมߋ
REACT-NATIVE-FFMPEGͰΑ͘͏Ͱ͋Ζ͏ίϚϯυ fpsΛ10Ͱԣ320pxͷgifը૾Λ࡞
REACT-NATIVE-FFMPEGͰΑ͘͏Ͱ͋Ζ͏ίϚϯυ 10ඵͰαϜωΠϧΛ࡞Δ
ҙ ▸ Γൈ͖͔͔࣌ؒΒͳ͍͚Ͳεέʔϧมߋ͕͔͔࣌ؒΔ ▸ όΠφϦׂͱେ͖ΊʹͳΔ ▸ ͳ͍͠ϑΝΠϧαΠζʹΑͬͯॲཧ͕͍͜ͱ ▸ ΞϓϦαΠζ͕૿͕͑ͪͳͷͰɺҰ࣌ϑΝΠϧͷআ͕ඞཁ ▸
มதʹॲཧ͕ࢭ·ͬͨͱ͖ͷresumeॲཧΛೖΕΔඞཁ͋Γ ▸ มͨ͠ಈըΛwebͰ͍͍ͨ߹ͳͲίʔσοΫʹҙ ▸ ΧϝϥϩʔϧͷΑ͏ͳฤूػೳΛ࡞Ζ͏ͱ͢Δͱίϯϙʔωϯ τͷ࡞ΓࠐΈ͕ൃੜׂͯ͠ͱਏ͍
REACT-NATIVE-FFMPEGΛͬͯಈըΛ͍͘͡Γճͦ͏ ·ͱΊ
·ͱΊ ▸ ༷ʑͳϥΠϒϥϦ͕͋Δ͕ɺϕετͳಈըฤूϥΠϒϥϦͳ͍ ▸ ffmpegΛͬͯࣗલͰฤूը໘Λ࡞ΔܗʹͳΓ͕ͪ ಈըฤूΛΞϓϦͰΔͷྗ͕ඞཁ
͓ΘΓ