tannergaucher/vertical-shorts-app

Social media video automation

Vertical Shorts App

Upload and publish social media videos to multiple platforms at once.

Uses

• React
• Remix
• TypeScript
• PostgreSQL
• Prisma
• CockroachDB
• Google Cloud Storage
• Google Cloud Pub / Sub
• Google Cloud Functions
• Google Cloud Run
• Google Cloud Build
• Google Cloud Video Intelligence
• Stripe Subscriptions

Generate Prisma Client

Generate Prisma client

npx prisma generate

Migrate dev

npx prisma migrate --dev

Deploy Remix App via Netlify CLI

Deploy Preview

From root directory run:

netlify deploy --build

Deploy to Production

From root directory run:

 netlify deploy --build --prod

vertical-shorts-app's Issues

handle rendering placeholder gif

Single publish page

Update upload flow from a series of pages to a single publish page.

From this page, a user can

• Add title
• Upload Video
• Add or generate description and tags
• Schedule

And then post

render subscription status on admin page

migrate tiktok oauth to v2 login api

• https://developers.tiktok.com/bulletin/migration-guidance-oauth-v1/

support video level tags

• inherit tags from project level tags
• call analyze video to automatically create tags with video intelligence api
• user can remove project / generated tags
• user can add tags associated to video

update to custom domain

• Buy domain
• Update prod domain in util/constants
• Update Oauth callback urls in Google (Youtube) and TikTok
• Deploy

implement facebook login Oauth

Do systems design and add docs to repo

handle scheduling

• Update scheduling page to publish now OR schedule publishing
• Add fetchPostsForPublishing cloud scheduler function
• Add publishContent function for each social integration
• Handle fetching posts and publish to PublishContent event
• Get approval for public posting on youtube developer app, tiktok developer app

handle content status linking to social pages

• Add socialId fields on Content model
• Persist social id to content table on uploading
• Use social Id to build links in

Do systems design and add to docs

use zod for form, params validation

• https://www.remix-validated-form.io/zod-form-data
• https://egghead.io/blog/validating-remix-form-data-using-zod-and-typescript-in-action-functions

support project level tags

Explore Cloud Video Intelligence labelling

• https://cloud.google.com/video-intelligence/docs/annotate-video-command-line

Handle scheduling post publishing

Setup ETL Process

fetchContentForPublishing

Setup cursor based fetching to:

• fetch posts where the publishDate is === today and publishTime === this hour
• call publishContent, which sets the sets the visibility status from private to public for each integration

Update uploadTikTok endpoint to direct post api

add-handleContentCreate-event

• in handleContentCreate, publish to uploadToYouTube, uploadToTikTok, etc
• handle publishing to handleContentCreate in remix app

Deploy Cloud Functions second gen

Add Stripe - Handle signup and user roles

• Create signup landing page and redirect from index on !auth
• Add plans in Stripe
• Render Stripe payment plan cards
• Handle trialing users: !signed up account can post 5 videos

Fix not handling refresh token correctly

Deploy remix app to netlify

add i18n support

• using i18n w/ remix: https://locize.com/blog/remix-i18n/

migrate service stripe to ts