Video Site

为了搭建一个受控的marketing channel，需要搭建一个视频网站，对标youtube！

youtubeClone project

作者: n5321

  1. 用git来clone source code

    1. git clone https://github.com/ruhulashazid/youtube_clone

    2. 以上使用全局代理

    3. pip freeze > requirements.txt（nothing）

    4. pip install django==4.2 -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

    5. pip install django-jazzmin -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

      1. Jazzmin 的主要特点

        1. 美化 Django Admin 界面

          • 采用 Bootstrap 4 设计，使界面更现代、易用。

          • 颜色主题可定制（支持 暗黑模式）。

        2. 增强导航与菜单

          • 支持自定义左侧 菜单项，可以按用户权限动态调整。

          • 可折叠侧边栏，方便管理不同功能模块。

        3. 增强的 UI 控件

          • Dashboard（仪表盘）：可视化展示数据。

          • 快速搜索：可以在顶部搜索 Django 模型数据。

          • 图标支持：可以给菜单项添加 FontAwesome 图标。

        4. 权限 & 角色管理

          • 可以根据用户权限动态调整菜单和操作项。

    6. django-import-export 是 Django 的一个第三方库，主要用于 在 Django Admin 中导入和导出数据，支持 Excel、CSV、JSON、YAML 等格式。

    7. pip install django-import-export -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

    8. pip install django-taggit -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com
      ​
      pip install pillow -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com
      ​

site可以正常运行！

  1. 添加django-debugger

    1. pip install django-debug-toolbar -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

  2. 考虑添加Django Extensions

    1. pip install django-extensions -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

    pip install --upgrade django-jazzmin -i http://mirrors.aliyun.com/pypi/simple/ --trusted-host mirrors.aliyun.com

分析：

一个前段copy youtube的site，在后端的功能上就没有实质性的东西了。

一个插件，看起来效果还可以，django-jazzmin，多了一个admin，and 布局上面看起来高端一点。但是也没有什么本质的更新！

Technologies Used

  • React: A JavaScript library for building user interfaces.

  • Redux: A state management tool for managing the application state.

  • React Router: A standard library for routing in React applications.

  • Axios: A promise-based HTTP client for making requests to the backend.

  • CSS Modules: For styling the components in a modular and reusable way.

  • Bootstrap: For responsive design and pre-built components.

    上面的react，redux and react router axios不熟悉，没怎么用过！

它在前端能够把youtue完全抄下来，其实也是不错的！值得参考and 学习的。

解剖：

  1. comments系统

    1. comments是scratch的comments，为什么不用第三方工具做的？+

    2. like or dislike的功能可用！怎么实现的？！

    3. @login_required 确保只有已登录的用户可以访问 Studio 页面，否则会跳转到登录页。

      1. 这个python interface 功能有价值，但是用得少！

  2. auths有点不一样的地方！

总体逻辑上没有特别厉害的地方！细节上的东西也不是很完备，但是有很多可以参考借鉴的地方，或者说我不够熟悉的地方！

问题是要不要delve into this idea？还是有价值，在前端 and management的地方还是要借鉴一下！

https://www.reddit.com/r/django/comments/1fyspu3/i_love_django_i_dont_use_any_third_party_django/?rdt=58651

What I've used

• Djoser for auth

• REST Framework JWT for login sessions

• DRF Spectacular for OpenAPI docs

• Celery/Celery Beat for tasks

• Django Silk for performance profiling

• Django Extensions (that's the name) to use PyGraphviz to programatically generate rough ERDs for reference (using the graph_models command)

Can't say that I've contributed to extensions themselves. Haven't had much difficulty beyond the typical pains you run into when learning something new

Here's my go to list for things:

  • django-all-auth: for any social authentication, e.g. Login w/ Google, Github, Twitter, etc

  • django-import-export: if you need/want to import/export data from a spreadsheet into or out of your DB

  • django-vite: if you need javascript to be bundled, like for react, vue, angular, or even just some nice UI for a GIS map. Bit of a pain to setup IMO, but once it's done, it's really great

  • django-tables-2: for making tables out of django models. I like this library, but do wish there were something a little more fully featured, you have to build out a lot of common stuff yourself.

  • django-filters: for filtering querysets based on URL params, pairs really nicely with django tables.

  • django-anymail: if you want to integrate with any third party mail provider, like mailgun for sending mail, just use this, it's super easy

  • celery+celery beat: async tasks + scheduling them

  • django-waffle: feature flags

  • django-simple-history: a means of getting an audit log on CRUD operations on your model instances, e.g. Bob updated item_price from $4 to $5 -- also let's you revert state

  • django-htmx: adds some nice syntax sugar when using htmx

  • django-storages: abstracts S3 access to make it play nice with django's FileField, where you can upload a file in a form and it'll go straight to S3

  • django-crispy-forms: if you're using django forms, then crispy forms (i like django crispy tailwind) makes your form UI look much nicer

  • django-template-partials: makes it much easier to send partials from your backend (pairs well with htmx) so you don't have to have a million partials files that are hard to track down

  • django-cleanup: deletes files from S3 if the object that was referring to it was also deleted

  • django-widget-tweaks: gives you some nice utilities for django form widgets, don't use it too often but it's good to know about

  • django-components: I love django components, it's a great way to define UI elements as components (kind of like in react). It's basically an extension of the django templating system, overall I've enjoyed it a lot. The maintainer Emil and contributor Juro care about it a lot.

  • django-debug-toolbar: for profiling N+1 queries, among many other things

There's definitely more, but I'll go with that for now!

All auth for auth is good

  1. django-fastdev is a must imo. iommi will break your brain a bit, but will make you super fast at doing CRUD stuff.

  2. Mostly good. I sometimes fix bugs in things I use, and then send fixes. That's about it.

  3. django-q really bit me. Don't use it.

video: FileField，用于存储视频文件，路径通过 user_directory_path 函数动态生成（以用户 ID 为文件夹）。

这确实是一个goodidea！

它的视频文档上传怎么用在channel里面？！

将 YouTube 的 Channel 和 Video 做成两个独立的 Django 应用（app）有其特定的价值和好处。这样的分离设计可以使系统更加模块化，易于维护和扩展。以下是一些具体的解释和价值：

1. 关注点分离 (Separation of Concerns)

将频道（Channel）和视频（Video）拆分为独立的应用可以帮助保持每个应用的职责单一：

  • Channel 应用：专注于管理用户频道、频道信息、频道的关注与订阅、频道的所有者等。

  • Video 应用：专注于管理视频的上传、播放、评论、标签、点赞等功能。

通过这样的设计，您可以确保每个应用的逻辑和数据模型清晰，避免一个应用中功能过于复杂或耦合。

2. 模块化开发与维护

当应用之间分离时，您可以独立开发、测试、维护每个功能模块。例如：

  • Channel 应用的变化不会影响到Video 应用，如频道信息的修改或频道用户的管理。

  • Video 应用的更新（如视频格式支持或评论功能）不会干扰到频道管理功能。

这种模块化的方式使得团队能够高效协作，减少功能开发与维护上的冲突。

3. 更好的扩展性

分离的应用更容易进行扩展。如果将来需要增加更多与视频或频道相关的功能，您可以独立扩展相应的应用，而不需要担心影响到其他部分。例如：

  • Channel 应用：未来可以添加更多的社交功能，如用户在频道之间互动、频道的推荐系统等。

  • Video 应用：可以添加更多的视频处理功能，如转码、推荐视频、视频分析等。

这种扩展性可以帮助系统随着需求变化灵活演进。

4. 重用性和可组合性

如果将 Channel 和 Video 拆分为两个独立的应用，其他项目或功能也可以复用这些应用。例如：

  • 您可以将Video应用集成到其他项目中，提供视频上传和播放的功能。

  • Channel应用也可以在不同的场景下重用，如构建不同的社交平台或多媒体网站。

通过将两个应用拆分，它们不仅仅局限于一个系统，而是可以更灵活地作为模块进行复用。

5. 清晰的数据库设计

在数据库设计上，通过将 Channel 和 Video 分开，数据表结构会更加简洁和明确：

  • Channel 应用可以有自己的模型（如 Channel，Subscription 等），直接管理用户和频道相关的数据。

  • Video 应用则可以有自己的模型（如 Video，VideoComment，VideoTag 等），专注于视频的管理。

数据模型的拆分有助于避免表结构的复杂化，使得查询、迁移、优化更加清晰。

6. 权限控制和安全性

拆分成两个应用时，您可以更细粒度地控制权限：

  • 在Channel 应用中，您可以管理谁可以创建、编辑、删除频道。

  • 在Video 应用中，您可以管理视频的上传、评论、观看权限等。

这样可以实现更精细化的权限控制，保证每个模块的安全性和合适的访问策略。

7. 有利于团队协作

如果您的项目团队较大，拆分为多个应用有助于团队成员之间的协作。例如，负责视频功能的开发人员专注于 Video 应用，而负责频道功能的开发人员则专注于 Channel 应用。这种结构促进了团队的分工与合作。

8. 未来的跨平台支持

通过将频道和视频分开，未来可以更加方便地将这些功能迁移到其他平台，甚至进行微服务架构的拆分。例如：

  • 将 Channel 应用单独部署为一个微服务，专门处理频道相关的数据。

  • 将 Video 应用作为另一个微服务，专门负责视频上传、播放和流式传输。

9. 灵活的路由与 URL 结构

Django 中，路由和 URL 配置通常是按照应用来组织的。通过将 Channel 和 Video 分开，您可以更加清晰地配置不同的 URL 路径：

  • /channel/<channel_id>/：访问特定频道。

  • /video/<video_id>/：访问某个视频。

这样，您的 URL 路由结构清晰且易于管理。

你说的非常准确！YouTube频道确实在某种程度上扮演了“类别”（category）的角色，尤其是在以下几个方面：

1. 内容分类与聚合：

  • 频道允许创作者将同一主题或风格的视频集中在一起，形成一个内容集合。

  • 观众可以通过订阅频道，方便地获取特定领域或兴趣的内容，这实际上起到了内容分类的作用。

  • 例如，一个频道专门发布游戏视频，那么它就相当于一个“游戏”类别。

2. 兴趣社群的形成：

  • 频道往往会吸引具有相同兴趣的观众，形成一个社群。

  • 这种社群的形成，实际上也是一种基于兴趣的分类。

  • 例如，一个频道专门发布健身视频，那么它就会吸引对健身感兴趣的观众。

3. 搜索与推荐：

  • YouTube的搜索和推荐算法，会根据频道的主题和内容，将相关的视频推荐给用户。

  • 这实际上也是一种基于频道的分类。

  • 当用户搜索“美食教程”时，YouTube会推荐发布美食教程的频道。

4. 频道主题化:

  • 许多频道都会有非常明确的主题，比如：

    • 游戏频道

    • 美食频道

    • 科技频道

    • 音乐频道

  • 这些主题化的频道，实际上就是一种细分的内容类别。

但是，频道与传统的“类别”也有一些区别：

  • 个性化：

    • 频道更加强调创作者的个性和风格，而传统的类别更加强调内容的共性。

  • 动态性：

    • 频道的内容是动态更新的，而传统的类别往往是静态的。

  • 互动性：

    • 频道更加强调创作者与观众的互动，而传统的类别往往缺乏互动。

总结：

  • YouTube频道在一定程度上起到了内容分类的作用，但它又超越了传统的类别，具有更强的个性化、动态性和互动性。

  • 因此，我们可以说，频道是YouTube上一种特殊的“类别”，它既是内容的集合，也是社群的载体。

他妈的，这样子就要做一个大的改动了！

新建application channel

from channel.models import Channel

Channel.objects.create(user=n5321)

Channel 应用 URL 结构

1. 频道页面 (Channel Pages)

  • 频道主页: /<channel_name>/ （channel-profile）

  • 视频列表: /<channel_name>/video/ （channel-videos）

  • 关于频道: /<channel_name>/about/ （channel-about）

  • 社区帖子: /<channel_name>/community/ （channel-community）

  • 社区帖子详情: /<channel_name>/community/<int:community_id> （channel-community-detail）

2. 社区互动 (Community Interactions)

  • 创建评论: /community/<int:community_id>/create-comment/ （community-create-comment）

  • 删除评论: /community/<int:community_id>/<int:comment_id>/ （community-delete-comment）

  • 点赞帖子: /community/<int:community_id>/like/ （community-post-like）

3. 视频管理 (Video Management)

  • 上传视频: /channel/create/video/ （upload-video）

  • 编辑视频: /channel/edit-video/<channel_id>/<video_id>/ （video-edit）

  • 删除视频: /delete-video/<video_id>/ （video-delete）

4. 社区帖子管理 (Community Post Management)

  • 创建帖子: /create-community-post/<channel_id>/ （create-post）

  • 编辑帖子: /edit-community-post/<channel_id>/<community_post_id>/ （edit-post）

  • 删除帖子: /delete-community-post/<channel_id>/<post_id>/ （delete-post）

这样子搞把问题搞复杂了。长期来看，要做这个东西，但是短期不能给用户创造价值。暂时give up！

前端的若干个问题：

  1. 把前端的界面整体上改成youtube风格，页面看起来好了很多。

    1. 技术上用的还是bootstrap，细节的地方后续再微调！

    2. 《i class="material-icons">login</i>这种符号确实是比较好用，比较有价值的东西！

  2. container maybe 不用fluid会更好一点？！整体这个页面其实也可以用到book上去。！

  3. 后台css and js的东西暂时是直接copy过来的，后续肯定还需要做一个整合！

  6. check 原版本，最开始做这个video只是希望有一个可控的video source，没有做detail page页面！

    1. 关键的点在于，原来是鼠标挪过去，就基本上可以看到视频播放的！{{ video.video_file.url }}，只是简单在用这个logic！

    2. 因为field name改了，跟着改一下字段名就OK了！

  7. detail page还需要做一下！

  8. comment还是需要一个comment！（它要求要先登录才能comment!）它的comment总的来看确实是还可以的。先做detail page！

  11. 新增加了一个detail页面

  12. 整个结构上算是OK了，可是在视觉效果上有不满意的地方！原因是后面的css混乱，自制的css 与bootstrap的css互相冲突，最后出现的效果就杂乱了。

  13. index页面算是还不错的！icon用起来以后页面的质感就全部上去了！

  15. 争取3月份把这个东西做完，4月份就可以填内容进去做推广了！

  16. tutorials的页面在视觉效果上也可以考虑跟着一起update过来！

  19. 接下来的点应该是把html的code搞干净！还有一个就是播放控制的问题

  22. 1. YouTube 播放器的基本架构

    YouTube 播放器是一个 HTML5 + JavaScript 的 Web 组件，主要包含以下几部分：

    🎥 (1) HTML5 Video 播放核心

    • YouTube 使用 HTML5 <video> 元素 来播放视频，但它不会直接暴露这个 <video> 标签，而是封装在 iframe 里。

    • 视频源是 MP4 (H.264) 或 WebM (VP9)，根据用户的设备和浏览器选择不同的编码格式。

    📡 (2) YouTube 的流媒体技术

    • DASH（Dynamic Adaptive Streaming over HTTP）：YouTube 会根据用户的网络状况动态调整视频分辨率（比如从 144p 到 1080p）。

    • HLS（HTTP Live Streaming）：在 iOS 设备上，YouTube 主要使用 HLS 技术。

    🔧 (3) IFrame Player API

    • 这个 API 让开发者可以通过 JavaScript 控制 YouTube 播放器（比如播放、暂停、调整音量）。

    • 使用 window.postMessage 机制在 iframe 和主页面之间通信。

    🎭 (4) DRM（数字版权管理）

    • YouTube 对一些受保护的内容（如电影、会员视频）使用 Widevine 或 PlayReady DRM 技术，防止用户直接下载视频。

  23. 这个视频站要做得漂亮的话确实还需要相当的功夫！

  24. video file 改用filer来管理控制！

  25. 20250317 完善detail page

    1. html的页面结构问题，sidebar的内容改掉了。

    2. 关键的问题应该还是在code structure那里！

  26. 内部的business logic呢？！

  27. 回头搞其他的part！——youtube clone里面还有若干个设计值得clone过来！