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
930
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
330
npm packageとリリースとモノレポ
watanabeyu
0
64
react-native-unimodulesを用いてのApp内課金実装
watanabeyu
0
1.1k
gandhの紹介です
watanabeyu
0
35
XcodeやAndroid Studioを弄らないアイコン管理
watanabeyu
2
660
Firebaseオンリー + React Nativeでアプリを作ると果たして簡単になるのか?
watanabeyu
4
1.3k
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
Understanding Ruby Grammar Through Conflicts
yui_knk
1
120
The State of Fluid (2025)
s2b
0
190
レガシープロジェクトで最大限AIの恩恵を受けられるようClaude Codeを利用する
tk1351
2
980
AHC051解法紹介
eijirou
0
620
[FEConf 2025] 모노레포 절망편, 14개 레포로 부활하기까지 걸린 1년
mmmaxkim
0
970
開発チーム・開発組織の設計改善スキルの向上
masuda220
PRO
13
7.2k
バイブコーディング × 設計思考
nogu66
0
130
AI OCR API on Lambdaを Datadogで可視化してみた
nealle
0
180
大規模FlutterプロジェクトのCI実行時間を約8割削減した話
teamlab
PRO
0
490
パスタの技術
yusukebe
1
400
コーディングエージェント時代のNeovim
key60228
1
100
UbieのAIパートナーを支えるコンテキストエンジニアリング実践
syucream
2
690
Featured
See All Featured
Facilitating Awesome Meetings
lara
55
6.5k
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
danielanewman
229
22k
Optimising Largest Contentful Paint
csswizardry
37
3.4k
Building Better People: How to give real-time feedback that sticks.
wjessup
367
19k
A better future with KSS
kneath
239
17k
A Tale of Four Properties
chriscoyier
160
23k
Why Our Code Smells
bkeepers
PRO
338
57k
Building a Scalable Design System with Sketch
lauravandoore
462
33k
Designing for Performance
lara
610
69k
The Language of Interfaces
destraynor
160
25k
Why You Should Never Use an ORM
jnunemaker
PRO
59
9.5k
Side Projects
sachag
455
43k
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ΛͬͯࣗલͰฤूը໘Λ࡞ΔܗʹͳΓ͕ͪ ಈըฤूΛΞϓϦͰΔͷྗ͕ඞཁ
͓ΘΓ