`
sillycat
  • 浏览: 2542977 次
  • 性别: Icon_minigender_1
  • 来自: 成都
社区版块
存档分类
最新评论

Video Solution(1)Video Framework and Frontend Solution

 
阅读更多
Video Solution(1)Video Framework and Frontend Solution

Convert to Standard mp4 format for HTML5
App ‘Free MP4 Converter'

Video Play JS Framework
Check the CDN Version for HTML5 video player
http://videojs.com/getting-started/

Place the index.html and video in the same directory
<html>
<head>
  <link href="http://vjs.zencdn.net/5.8.8/video-js.css" rel="stylesheet">

  <!-- If you'd like to support IE8 -->
  <script src="http://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>
</head>

<body>
  <video id="my-video" class="video-js" controls preload="auto" width="640" height="264"
  poster="MY_VIDEO_POSTER.jpg" data-setup="{}">
    <source src="诛仙青云志01.mp4" type='video/mp4'>
    <p class="vjs-no-js">
      To view this video please enable JavaScript, and consider upgrading to a web browser that
      <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a>
    </p>
  </video>
  <script src="http://vjs.zencdn.net/5.8.8/video.js"></script>
</body>

</html>

It works pretty well. I will try with nginx and try to see if it works great from remote server.

Mobile and Web Solution
Set up Latest NodeJS
> wget https://nodejs.org/dist/v6.9.1/node-v6.9.1.tar.gz
…snip...
> ./configure --prefix=/Users/carl/tool/node-v6.9.1
…snip...
We have the latest version on my MAC system
> node --version
v6.9.1

Install latest cordova and ionic
> npm install -g cordova ionic

Check the version after installation
> cordova --version
6.4.0

> ionic --version
2.1.13

Dependency warning - for the CLI to run correctly,
it is highly recommended to install/upgrade the following:

Install ios-sim to deploy iOS applications.`npm install -g ios-sim` (may require sudo)
Install ios-deploy to deploy iOS applications to devices.  `npm install -g ios-deploy` (may require sudo)

> npm install -g ios-sim
> npm install -g ios-deploy

Check all the settings with First Sample Project
> ionic start smart-fisher tabs

try with iOS
> ionic build ios
Deploy to emulator
> ionic emulate ios
We can specify the device version
> ionic emulate ios --target="iPhone-6"

try with Android
> ionic platform add android
> ionic build android

I am using genymotion, start the device emulator from genymotion.

start app on device
> ionic run android

try Web Browser
> ionic serve --lab

The page will automatically open
http://localhost:8100/ionic-lab

The ‘real’ web version will be like this
> ionic serve
http://localhost:8100/#/tab/dash

Create a new version Project
> ionic start myionic2project tutorial --v2
> ionic serve

Visit page   http://localhost:8100/
TS version Project
> ionic start myionic2project2 tutorial --v2 --ts

Ionic2 Sample Project
https://github.com/chsakell/ionic2-angular2-firebase
https://chsakell.com/2016/08/27/building-hybrid-mobile-apps-using-ionic-2-and-firebase/

blog
https://github.com/jackhutu/jackblog-ionic2

resturant
https://github.com/srehanuddin/Ionic2-ResturantApp

Check the Blog Example First, Set up the Server side
> git clone https://github.com/jackhutu/jackblog-api-express.git

Go to the directory
> npm install
> npm install -g gulp
> gulp serve

On my local, maybe my local 9000 is used, so I open the server settings in  file
server/config/env/index.js and change the port number from 9000 to 9001

I start my local Redis
> bin/redis-server

I start my local mongodb
> mongod -f conf/mongodb.conf

Then I can start the express server and get the page
http://localhost:9001

Download and try this IDE
http://www.nodeclipse.org/

The reactJS version
> git clone https://github.com/jackhutu/jackblog-react.git

Since I change the server side to 9001, so I update the config on the client in src/config.js

Visit page
http://localhost:3000/

Still need angularJS2 and ionic2
https://github.com/jackhutu/jackblog-ionic2
https://github.com/jackhutu/jackblog-angular2
https://github.com/jackhutu/jackblog-admin

References:
http://videojs.com/getting-started/
http://framework7.io/get-started/

https://www.ekreative.com/blog/using-ionic-2-with-angular-2-to-make-a-hologram-projector-app

ionic UI
http://sillycat.iteye.com/blog/2284701  Installation
http://sillycat.iteye.com/blog/2285319  Installation and TypeScript
http://sillycat.iteye.com/blog/2285543  TypeScript
http://sillycat.iteye.com/blog/2285848  project structure
http://sillycat.iteye.com/blog/2342392  Options to start backend and front end development

Python framework
For high volume traffic, a non-blocking framework like Tornado is a good choice. For CMS-type systems (or if you're happy with the routing/templating/database stack that's built in by default) Django is easy to get going with, while Pylons (now Pyramid) provides more flexibility. CherryPy offers a simpler approach for relatively small projects.


Others mentioned:

- Flask  http://flask.pocoo.org/
- Pyjamas, http://pyjs.org/
- Web.py, http://webpy.org/
分享到:
评论

相关推荐

    Full-Stack Vue.js 2 and Laravel 5 Bring the frontend and backend together epub

    Full-Stack Vue.js 2 and Laravel 5 Bring the frontend and backend together with Vue, Vuex, and Laravel 英文epub 本资源转载自网络,如有侵权,请联系上传者或csdn删除 查看此书详细信息请在美国亚马逊官网...

    Trainable Frontend For Robust and Far-Field Keyword Spotting.pdf

    Trainable Frontend For Robust and Far-Field Keyword Spotting 1. Introduction 2. Per-Channel Energy Normalization 3. Trainable PCEN Fronten 4. Experiments: PCEN vs. log-mel 5. Discussions and ...

    jad.exe and frontend.exe

    标题中的"jad.exe and frontend.exe"提到了两个关键程序,jad.exe和FrontEnd.exe,它们在Java开发中扮演着特定的角色。jad.exe是Java反汇编器(Java Decompiler),而FrontEnd.exe可能是jad的一个图形用户界面(GUI...

    frontend_framework

    "frontend_framework"这个主题聚焦在用于创建用户界面的JavaScript库和框架上。JavaScript,作为Web开发的三大核心技术之一,对于构建交互性强、响应式及时的前端应用至关重要。 JavaScript前端框架通过提供一套...

    UPX Frontend v3.01

    UPX Frontend v3.01 是一个专为IT专业人士设计的应用软件,它提供了一种图形用户界面(GUI)来简化UPX(Ultimate Packer for eXecutables)的使用过程。UPX是一款开源的、免费的、强大的可执行文件打包器,能够对...

    FrontEnd

    1. **jad.exe**:这个文件可能是JAD工具的可执行文件,用户可以通过双击运行来处理Java字节码。 2. **FrontEnd.exe**:这可能是一个前端开发工具的可执行文件,用户可以使用它来进行前端项目开发、构建或打包等工作...

    FrontEnd 反编译工具

    1. **Readme-说明.htm**:这是通常包含软件使用指南和注意事项的文档,可能会提供关于如何安装和使用FrontEnd的具体步骤,以及可能遇到的问题和解决方法。 2. **Install.txt**:这通常是一个简短的安装说明文件,...

    FrontEnd-java反编译工具

    Java前端(FrontEnd)是一种用于Java程序反编译的工具,它可以帮助开发者查看和理解已编译的Java字节码。在软件开发过程中,源代码通常被编译成字节码,这是一种平台无关的中间语言,Java虚拟机(JVM)能够理解和...

    前端项目-videojs-youtube.zip

    这个压缩包`frontend-project-videojs-youtube.zip`包含了实现这一功能的源代码,主要文件名为`videojs-youtube-master`,这表明它是`videojs-youtube`项目的主分支或源代码。 Video.js是一个强大的JavaScript和CSS...

    beapi-frontend-framework:WordPress友好的前端框架

    BeAPI前端框架什么是BeAPI FrontEnd Framework? BeAPI FrontEnd Framework(BFF)是一个前端WordPress主题友好样板,可帮助您使用现代工具和更高的生产率来构建自己的WordPress主题。工具类要求作曲家您需要作曲家...

    jad和frontEnd反编译器

    1. 安装反编译器:首先,你需要下载并安装jad或FrontEnd,根据它们的文档完成安装配置。 2. 获取.class文件:找到你想要反编译的Java类对应的.class文件,这些文件通常位于.jar或.dex文件中。 3. 运行反编译器:启动...

    Frontend Architecture for Design Systems

    Imagine what a large-scale web project would look like if frontend development were not treated as an add-on, but as an equal partner with backend development and content strategy. This practical book...

    FrontEnd&jad;

    而"FrontEnd&jad;"这个主题似乎关联到前端开发领域,并且与Java反编译工具有关,这对于理解、学习和分析Java代码非常有用。下面我们将详细探讨这些知识点。 首先,前端开发主要涉及HTML、CSS和JavaScript技术,它们...

    jad | FrontEnd

    FrontEnd 允许用户通过交互式的图形界面来选择需要反编译的.class文件,查看反编译结果,并进行一些基本的操作,如搜索、高亮显示等。这对于非命令行熟练的用户或是需要频繁进行反编译操作的开发者来说,无疑是一种...

    fcitx-frontend-qt5

    fcitx-frontend-qt5的离线安装包

    cxf-rt-frontend-jaxrs-3.0.1-API文档-中文版.zip

    赠送jar包:cxf-rt-frontend-jaxrs-3.0.1.jar; 赠送原API文档:cxf-rt-frontend-jaxrs-3.0.1-javadoc.jar; 赠送源代码:cxf-rt-frontend-jaxrs-3.0.1-sources.jar; 赠送Maven依赖信息文件:cxf-rt-frontend-jaxrs...

    java反编译工具FrontEnd V2.03

    其中,"FrontEnd V2.03"是一款著名的Java CLASS文件反编译工具,专为Java开发者设计,以帮助他们查看和理解Java字节码。这个工具不仅提供了基本的反编译功能,还有其他一些实用特性,使其在同类工具中脱颖而出。 ...

    cxf-rt-frontend-jaxws-3.0.1-API文档-中文版.zip

    赠送jar包:cxf-rt-frontend-jaxws-3.0.1.jar; 赠送原API文档:cxf-rt-frontend-jaxws-3.0.1-javadoc.jar; 赠送源代码:cxf-rt-frontend-jaxws-3.0.1-sources.jar; 赠送Maven依赖信息文件:cxf-rt-frontend-jaxws...

    JAVA反编译工具Frontend+2.0

    JAVA反编译工具Frontend+2.0

    WP User Frontend Pro汉化版2.2.4

    1. **WordPress 插件系统**:WordPress是一个流行的开源CMS(内容管理系统),其插件系统是其强大之处。WP User Frontend Pro是这个系统中的一个组件,它可以扩展WordPress的功能,使网站更加多功能和用户友好。 2....

Global site tag (gtag.js) - Google Analytics