Once the video processing is finished, we need to update the status of the video in DB to "done".
In order to do so we need to be notified when the Media Convert finishes its job.
Thankfully it's easy to do so by using CloudWatch event:
• Create an event filter for finished or failed jobs that comes from the raw video bucket
• Forward the event to the post-processing lambda
• Let the lambda update the status of the video to "done"
One cool thing about Media Convert is we can put a custom user metadata in each job.
I put the bucket name and the object key of the finished job so my Lambda knows which row to update in DB.
Once the raw video is processed, it will be stored with the db primary key as the main folder.
This makes video deletion easier.
All I need to do is list out the objects in that folder and delete them.
The uploaded videos will have the status set to "processing".
The videos with this status will not show up on home screen.
The video upload is done in two parts:
• Upload the file to S3
• Add a new video record to DB
How do we make sure that this S3 object belongs to that new row?
My approach is:
• Generate a presigned POST with a random string as the object key
• Use the random string as a primary key for the new row
The big problem with regular S3 presigned URL is users can abuse the upload with gigantic files.
S3 presigned POST can prevent this from happening.
Presigned POST has upload rules such as maximum file size.
The NextJS app is hosted on Elastic Beanstalk.
All I need to do is to setup the build as standalone output, package the output as a zip file and upload.
Beanstalk is quite easy to use, at least for development.
Now I need a web app for users to sign in an upload their videos.
Teaching myself to use AWS Cognito to manager users.
Need to use Amplify SDK to make the sign in work otherwise the setup is unbearable.
Clerk and Auth0 are miles better.
JS bundle optimization trick that people overlook.
You need to use a large JS package on the frontend for specific operations, such as on a button click.
Using dynamic imports can defer the bundle download until the code is actually executed.
This approach not only reduces initial load times but also improves the overall performance of your web application by loading resources on demand.










