Total Pageviews

Saturday, 2 June 2012

开源的Web开发资源

★ HTML5 Rocks : Major Feature Groups 的学习 HTML5 的资源 (HTML5 演示, 教程 ). 源码
★很不错的 HTML5 Dashboard – Mozilla,效果很炫。
★WhatWG Developers, 一个清楚的 HTML5 技术规格说明书。
★ StackOverflow : 大名鼎鼎的技术问答式论坛。
★ Addyosmani, jQuery 和 JavaScript 文章教程
★Sohtanaka, jQuery 和 JavaScript 文章和教程
★ Nettuts+ 是一个面对Web开发人员和设计人员的网站,提供各种技术教程和文章,覆盖 HTML, CSS, Javascript, CMS’s, PHP 和 Ruby on Rails.
★Codrops, 教程和 web 资源
★WebAppers, 最好的开源资源
★Tutorialzine – PHP MySQL jQuery CSS 教程, 资源和赠品
★Mozilla JavaScript guide
★codes snippets, 作者自己收集的一些代码片段
服务器端的软件
clip_image002
★ Node.js 是服务器端的 JavaScript 环境,其使用了异步事件驱动模式。其让Node.js在很多互联网应用体系结构下获得非常不错的性能。 源码 和 实时演示。
★PhantomJS 也是一个服务器端的 JavaScript API的WebKit。其支持各种Web标准: DOM 处理, CSS 选择器, JSON, Canvas, 和 SVG
★Lighttpd 一个轻量级的开源Web服务器。新闻,文档,benchmarks, bugs, 和 download. Lighttpd 支撑了几个非常著名的 Web 2.0 网站,如:YouTube, wikipedia 和 meebo.
★NGinx, 性能巨高无比的轻量级的Web服务器。比Apache高多了。花了6年的时间,终于走到了1.0版。
★Apache HTTP Server 是一个很流行的并支持多个流行的操作系统的Web服务器。
★ PHP 可能是最流行的服务器端的Web脚本动态处理语言。
★当然,还有 Ruby, Python, Erlang, Perl, Java, .NET, Android, C++, Go, Fantom,CoffeeScript, D, …
PHP 框架和工具
clip_image003
★ WordPress 是一个基于博客系统的开源软件。
★Drupal 是一个内容管理系统 (CMS).
★Centurion 是一个新出现的开源 CMS ,一个灵然的 PHP5 Content Management Framework. 使用 Zend Framework, 其组件坚持通用,简单,清楚和可重用的设计原则。
★phpBB 一个开源的论坛(国内的Discuz!更多)
★★ SimplePie : 超快的,易用的, RSS 和 Atom feed PHP解析。
★★ PHPthumb, PHP 图片处理库
★★ PHPMailer 强大的全功能的PHP邮件库
★PubSubHubbub协议,一个简单,开放, server-to-server 的 pubsub (publish/subscribe) 协议——Atom and RSS的扩展。
数据库
clip_image004
★ Apache CouchDB 是一个面向文档的数据库管理系统。它提供以JSON 作为数据格式的REST 接口来对其进行操作,并可以通过视图来操纵文档的组织和呈现。.源码.
★MonoQL 是一个采用PHP+ExtJS开发的MySQL数据库管理工具。界面极像一个桌面应用程序,支持大部分常用的功能包括:表格设计,数据浏览/编辑,数据导入/导出和高级查询等。
★MariaDB 是MySQL的一个分支,由MySQL 创始人Monty Widenius 所开发。GPL,用来对抗Oracle所有的MySQL的license的不测。自Oracle收购SUN以来,整个社区对于MySQL前途的担忧就没有停止过。
★ SQLite 不像常见的客户端/服务器结构范例,SQLite引擎不是个程序与之通信的独立进程,而是连接到程序中成为它的一个主要部分。所以主要的通信协议是在编程 语言内的直接API调用。这在消耗总量、延迟时间和整体简单性上有积极的作用。整个数据库(定义、表、索引和数据本身)都在宿主主机上存储在一个单一的文 件中。它的简单的设计是通过在开始一个事务的时候锁定整个数据文件而完成的。库实现了多数的SQL-92标准,包括事务,就是代表原子性、一致性、隔离性 和持久性的(ACID),触发器和多数的复杂查询。不进行类型检查。你可以把字符串插入到整数列中。某些用户发现这是使数据库更加有用的创新,特别是与无 类型的脚本语言一起使用的时候。其他用户认为这是主要的缺点。
★SQL 在线设计编辑器,这一节的那个图片就是这个在线编辑器的样子了。一个画数据库图表的在线工具。很强大。
API 和 在线数据
clip_image005
★ProgrammableWeb, 最流行的Web Services 和 API 目录大全。
★Google Data Protocol 一组Google服务的数据服务API。
★Yahoo! Developer Network – APIs 和 Tools
★Yahoo! Pipes 可视化在线编程工具,它是一个用于过滤、转换和聚合网页内容的服务。
★ The Yahoo! Query Language 一个很像 SQL的网页查询工具。
在线代码和媒体编辑器
clip_image006
★ CodeRun Studio一个基于JavaScript语言开发的跨平台的集成开发环境,它立足于云计算的设计思路,方便开发者在浏览器端便可以轻松开发、调试和部署网络应用程序。(参看《Coderun.com 在线开发IDE》)
★Cloud9 IDE – 一个基于Node.JS构建的JavaScript程序开发Web IDE。它拥有一个非常快的文本编辑器支持为JS, HTML, CSS和这几种的混合代码进行着色显示。
★ jsFiddle – Javascript的在线运行展示框架,这个工具可以有效的帮助web前端开发人员来有效分享和演示前端效果,其简单而强大 (JavaScript, MooTools, jQuery, Prototype, YUI, Glow and Dojo, HTML, CSS)
★Akshell,一种云服务,它使用服务端的JavaScript和在线的IDE帮助开发者进行快速应用程序开发。 它还提供云托管,所以部署是即时的。
★JSONeditor, 一个好用的JSON 编辑器
★ TinyMCE 一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的各种浏览器,由JavaScript写成。
★Ext Designer 是一个桌面应用工具,帮助你快速开发基于ExtJS 的用户界面。
★ LucidChart,一款基于最新的html5技术的在线图表绘制软件,功能强大,速度快捷,运行此软件需要支持html5的浏览器。
★Balsamiq Mockups, 产品设计师绘制线框图或产品原型界面的利器。
★Color Scheme Designer 3 – 一个免费的线上调色工具
★ Pixlr, 是一个来自瑞典基于Flash的免费在线图片处理网站。除了操作介面和功能接近Photoshop,还是多语言版本,支持简体中文。
★Aviary, 是一个基于HTML5 的在线图片处理工具,可以很容易的对图片进行后期处理。
★Favicon Generator, 线上favicon(16×16)制作工具。
代码资源和版本控制
clip_image007
★ GitHub 是一个用于使用Git版本控制系统的项目的基于互联网的存取服务。
★Git 是一个由Linus为了更好地管理linux内核开发而创立的分布式版本控制/软件配置管理软件。其巨快无比,高效,采用了分布式版本库的方式,不必服务器端软件支持,使源代码的发布和交流极其方便。
★Google Code 谷歌公司官方的开发者网站,包含各种开发技术的API、开发工具、以及开发技术参考资料。
★Google Libraries API Google 将优秀的 JavaScript 框架部署在其 CDN 上,在我们的网站上使用 Google Libraries API 可以加速 JavaScript 框架的加载速度。
★Snipplr 一个开放的源代码技巧分享社区,号称Code 2.0。和一般的源码分享网站不同,它针对的并不是大型网站源码,而是一些编程的代码技巧。
JavaScript 桌面应用框架
clip_image008
★ jQuery 是一个快速、简单的JavaScript library, 它简化了HTML 文件的traversing,事件处理、动画、Ajax 互动,从而方便了网页制作的快速发展。 源码, API, API浏览, 很不错的文档.
★ 官方的 jQuery User Interface (UI) library (演示和文档). 源码,Themes Roller, Download.
★YUI 2 — Yahoo! User Interface Library
★Mootools, 一个超级轻量级的 web2.0 JavaScript framework
★Prototype 提供面向对象的Javascript和AJAX
★Dojo The Dojo Toolkit,一个强大的无法被打败的面向对象JavaScript框架。主要由三大模块组成:Core、Dijit、DojoX。Core提供 Ajax,events,packaging,CSS-based querying,animations,JSON等相关操作API。Dijit是一个可更换皮肤,基于模板的WEB UI控件库。DojoX包括一些创新/新颖的代码和控件:DateGrid,charts,离线应用,跨浏览器矢量绘图等。
★ Ext JS 4, 业内最强大的 JavaScript framework。
★PHP.js, 一个开源的JavaScript 库,它尝试在JavaScript 中实现PHP 函数。在你的项目中导入PHP.JS 库,可以在静态页面使用你喜欢的PHP 函数。
JavaScript 移动和触摸框架
clip_image009
★ jQuery Mobile : 是 jQuery 在手机上和平板设备上的版本。jQuery Mobile 不仅会给主流移动平台带来jQuery核心库,而且会发布一个完整统一的jQuery移动UI框架。支持全球主流的移动平台。jQuery Mobile开发团队说:能开发这个项目,我们非常兴奋。移动Web太需要一个跨浏览器的框架,让开发人员开发出真正的移动Web网站。我们将尽全力去满 足这样的需求。 Sources.
★Zepto.js Zepto.js 是支持移动WebKit浏览器的JavaScript框架,具有与jQuery兼容的语法。2-5k的库,通过不错的API处理绝大多数的基本工作。 Sources.
★MicroJS : Microjs网站应用列出了很多轻量的Javascript类库和框架,它们都很小,大部分小于5kb。这样你不需要因为只需要一个功能就要加载一个JS的框架。
★ PhoneGap :是一款开源的手机应用开发平台,它仅仅只用HTML和JavaScript语言就可以制作出能在多个移动设备上运行的应用。 Sources.
★ Sencha Touch Sencha Touch 是一个支持多种智能手机平台(iPhone, Android, 和BlackBerry)的 HTML5 框架。Sencha Touch可以让你的Web App看起来像Native App。美丽的用户界面组件和丰富的数据管理,全部基于最新的HTML5和CSS3的 WEB标准,全面兼容Android和Apple iOS设备。
★JQtouch, 是一个jQuery 的插件,主要用于手机上的Webkit 浏览器上实现一些包括动画、列表导航、默认应用样式等各种常见UI效果的JavaScript 库。 Sources.
★DHTMLX Touch 针对移动和触摸设备的JavaScript 框架。DHTMLX Touch基于HTML5,创建移动web应用。它不只是一组UI 小工具,而是一个完整的框架,可以针对移动和触摸设备创建跨平台的web应用。它兼容主流的web浏览器,用DHTMLX Touch创建的应用,可以在iPad、iPhone、Android智能手机等上面运行流畅。
jQuery 插件
clip_image010
★Waypoints 是一个jQuery 用来实现捕获各种滚动事件的插件,例如实现无翻页的内容浏览,或者固定某个元素不让滚动等等。支持主流浏览器版本。
★Lazy loader 插件可以实现图片的延迟加载,当网页比较长的时候,会先只加载用户视窗内的图片,视窗外的图片会等到你拖动滚动条至后面才加载,这样有效的避免了因图片过多而加载慢的弊端。
★TweenJS : 一个简单和强大的 tweening / animation 的Javascript库。
★Easings 类Css3的jQuery 动画插件
★Spritely 这个插件可以创建出如flash一样的动画效果,比如:在页面上有一只飞动的小鸟,一个动态滚动的背景等。
★File Upload, jQuery 文件上传插件4.4.1
★Slideshow/Carousel 插件. Sources.
★Supersized – 全屏式的背景/幻灯片插件
★Masonry i一款非常酷的自动排版插件,这款jQuery工具可以根据网格来自动排列水平和垂直元素,超越原来的css. Sources.
★jQuery 简单 Layout 演示,管理各种边栏式,可改变大小式的布局。
★Flexigrid – jQuery 数据表插件
★Isotope绝对是一个令人难以置信的jQuery插件,你可以用它来创建动态和智能布局。你可以隐藏和显示与过滤项目,重新排序和整理甚至更多。
★Super Gestures jQuery 插件可以实现鼠标手势的功能。
★MouseWheel 是由Brandon Aaron开发的jQuery插件,用于添加跨浏览器的鼠标滚轮支持。
★AutoSuggest jQuery 插件可以让你添加一些自动完成的功能。
★qTip 一个漂亮的jQuery 的工具提示插件,这个插件功能相当强大。
★jQuery Charts and graphic 用来制作图表。
★jQuery Tools– The missing UI library
其它 jQuery 资源
★http://www.smashingmagazine.com/2011/04/07/useful-javascript-and-jquery-tools-libraries-plugins
★http://webdesigneraid.com/weekly-html5-news-and-inspirations-%E2%80%93-tutorials-tools-resources-and-freebies-v-2/
★http://www.designer-daily.com/15-useful-jquery-plugins-and-tutorials-5207
★http://www.julien-verkest.fr/22/11/2007/240-plugins-jquery
★http://www.hotscripts.com/blog/10-great-html5-experiments-apps/
★http://www.noupe.com/jquery/excellent-jquery-navigation-menu-tutorials.html
★http://www.noupe.com/php/20-useful-php-jquery-tutorials.html
★http://aext.net/2010/04/excellent-jquery-plugins-resources-for-data-presentation-and-grid-layout/
★http://webdesigneraid.com/html5-canvas-graphing-solutions-every-web-developers-must-know/
★http://gestureworks.com/features/open-source-gestures/
★http://edtechdev.wordpress.com/2011/01/14/some-exciting-new-html5javascript-projects/
★http://net.tutsplus.com/articles/web-roundups/30-developers-you-must-subscribe-to-as-a-javascript-junkie/
HTML5 视频播放器
clip_image011
★ Popcorn.js 是一个HTML5 Video框架,它提供了易于使用的API来同步交互式内容,让操作HTML5 Video元素的属性,方法和事件变得简单易用。 (来自Mozilla)
★LeanBack Player HTML5视频播放器,没有依赖任何JavaScript框架。支持全屏播放,音量控制,在同一个页面中播放多个视频。 (来自Google)
★Vid.ly 为你上传的视频提供转换功能,并且为转换后的视频创建一个短网址。通过Vid.ly,让你的视频可以在14种不同的浏览器和设备上播放,不需要再去考虑将 要浏览视频的人使用什么设备了,以避免各各软件巨头之间的利益之争带来了不兼容,给用户带来了巨大的困扰,短网址让你可以通过Twitter、 Facebook等方式方便分享视频。Vid.ly还可以通过html代码嵌入到其他网页中。Vid.ly免费帐户空间为1GB,免费帐户也没有播放或浏 览限制。
JavaScript 音频处理与可视化效果
clip_image012
★ 使用HTML5 和 Flash, SoundManager V2 只用单一API的提供了可靠,简单和强大的跨平台的音频处理。
★DSP, JavaScript的声音Digital Signal Processing
★The Radiolab Hyper Audio Player v1, 带给你 WNYC Radiolab, SoundCloud 和 Mozilla Drumbeat
★jPlayer, 一个 jQuery HTML5 音频/ 视频库,功能齐全的API
JavaScript 图形 和 3D
clip_image013
★ Processing.js是一个开放的编程语言,在不使用Flash或Java小程序的前提下, 可以实现程序图像、动画和互动的应用。其使用Web标准,无需任何插件。
★ Javascript 3D 引擎: ThreeJS 由 Mr Doob 开发,一个轻量级的 3D 引擎,不需要了解细节,傻瓜都能使用。这个引擎可以使用<canvas>, <svg> 和 WebGL.
★Shader Toy, 一款使用WebGL的在线着色器编辑器(2D/3D). 基于在线的应用架构使您无需下载任何软件即可开始体验. Shader Toy包含大量实用着色器, 诸如光线追踪, 场景距离渲染, 球体, 隧道, 变形, 后期处理特效等.
★PhiloGL, Sencha的PhiloGL是首个WebGL开发工具之一,提供了高水准的功能,来构建WebGL应用。Sencha创建了几个演示,来描述框架交互式3D虚拟化的能力,比如3D view of global temperature changes。
★WebGL Inspector 你就Firebug等Web调试工具一样,这个是 WebGL的调试工具。
★WebGL frameworks 由 Khronos Group 收集的一个WebGL框架列表。
★EaselJS, 一个使用html5的canvas的 JavaScript 库. Sources.
★JavaScript Game Frameworks 免费的JS游戏框架列表。另,可参看 JS游戏框架列表。
★Rapha?l是一个小型的JavaScript 库,用来简化在页面上显示向量图的工作。你可以用它在页面上绘制各种图表、并进行图片的剪切、旋转等操作。参看Javascript向量图Lib–Rapha?l
★jQuery SVG 插件让你可以了 SVG canvas 进行交互。
★Google chart tools – 参看本站的使用Google API做统计图
★Arbor.js, 是一个利用webworkers和jQuery创建的数据图形可视化JavaScript框架。它为图形组织和屏幕刷新处理提供了一个高效、力导向布局算法。
JavaScript 浏览器接口 (HTML5)
clip_image014
★ Modernizr – 是一个专为HTML5 和CSS3 开发的功能检测类库,可以根据浏览器对HTML5 和CSS3 的支持程度提供更加便捷的前端优化方案.Sources. 一个有用的列表 cross-browser Polyfills
★HTML5Shiv : 该项目的目的是为了让IE 能识别HTML5 的元素。
★Polyfills : 这个项目收集了一些代码片段其用Javascript支持不同的浏览器的特别功能,有些代码需要Flash。
★YepNopeJS : 一个异步的条件式的加载器。Sources.
★jQuery CSS3 Finalise : 是否厌倦了为每一个浏览器的CSS3属性加前缀?
★ Amplify.js :一套用于web应用数据管理和应用程序通讯的 jQuery 组件库。 提供简单易用的API接口。Amplify的目标是通过为各种数据源提供一个统一的程序接口简化各种格式数据的数据处理。Amplify的存储组件使用 localStorage 和 sessionStorage标准处理客户端的存储信息,对一些老的浏览器支持可能有问题。Amplify’为jQuery的ajax方法request 增加了一些额外的特性。 Sources.
★History.js 优美地支持了HTML5 History/State APIs
★Socket.IO Web的socket编程。
JavaScript 工具
clip_image015
★ {{mustaches}} 小型的 JavaScript 模板引擎。
★json:select(), CSS式的JSON选择器
★HeadJS, 异步JavaScript装载。其最大特点就是不仅可以按顺序执行还可以并发装载载js。
★JsDoc Toolkit是一款辅助工具,你只需要根据约定在JavaScript 代码中添加相应的注释,它就可以根据这些注释来自动生成API文档。
★Responsive image, 一个试验性的项目,用来处理responsive layouts 式的图片。
★UglifyJS是基于NodeJS的Javascript语法解析/压缩/格式化工具,它支持任何CommonJS模块系统的Javascript平台。
★Dhteumeuleu, 交互式的 DOM 脚本和DHTML 的开源演示。
★Backbone是 一个前端 JS 代码 MVC 框架,被著名的 37signals 用来构建他们的移动客户端。它不可取代 Jquery,不可取代现有的Template 库。而是和这些结合起来构建复杂的 web 前端交互应用。如果项目涉及大量的 javascript 代码,实现很多复杂的前端交互功能,首先你会想到把数据和展示分离。使用 Jquery 的 selector 和 callback 可以轻松做到这点。但是对于富客户端的WEB应用大量代码的结构化组织非常必要。Backbone 就提供了 javascript 代码的组织的功能。Backbone 主要包括 models, collections, views 和 events, controller 。
客户端和模拟器
clip_image016
★BrowserShot, 检查浏览器的兼容性,跨浏览器平器的测试
★Test everything… 输入一个你想要测试的URL……
★Android browser 模拟器
★iPhone browser 模拟器
★Opera browser 模拟器
★ Firebug 与 Firefox 集成,可以查看和调试你的Web页面。
CSS3 和 字库
clip_image017
★ CSS3 Maker CCS3的生成器
★容易地创建 CSS3 animations。 Sencha Animator 是一个桌面应用可以为WebKit浏览器和触摸式移动设备创建 CSS3 animations 。
★CSSwarp – CSS 文本扭曲生成器
★Gradient Editor, 一个强大的Photoshop式的CSS 渐变编译器。来自 ColorZilla
★ Google Web Fonts 通过Google Web Fonts API 可以浏览所有的字体
★@font-face Kit Generator, 为Web转换字体
★Typetester, 比较字体。
★Media Queries. 一组 responsive web 设计。
★Pattern TAP, UI组件。
Website (FULL) 模板
clip_image018
★ HTML5 Boilerplate 是一个HTML5 / CSS / js模板,是实现跨浏览器正常化、性能优化,稳定的可选功能如跨域Ajax和Flash的最佳实践。 项目的开发商称之为技巧集合,目的是满足您开发一个跨浏览器,并且面向未来的网站的需求。 Sources.
★HTML5 starter pack 是一个干净的和有组织的目录结构,其可适合很多项目,还有一些很常用的文件,以及简单的Photoshop设计模板。
★ Initializr 是一个HTML5 模板生成器,其可以帮你在15秒内创建一个HTML5的项目。
★Animated Portfolio Gallery (教程)
★Slick MobileApp Website 如果通过 jQuery 和 CSS 制作一个手机应用的网站。
★RSS Reader 如果通过 jQuery Mobile 创建一个RSS Reader
★ Single Page Applications 使用jQuery的朋友们 (Backbone, Underscore, …)创建单一页面。
★Google TV Optimized Templates, 传统电视已经开始和网路融合,但现阶段产业仍然正在摸索之中,为此将来的网页亦会有结构上的改变。Google TV Optimized Templates是 一个用HTML/JavaScript制成的开源软体,一如其名是一个对Google TV作出了最佳化的的网页范本,其特色是以遥控器作为操作的前提,令使用者无需输入任何文字就可以进行控制。未来除了会有专用遥控器外,还会采用智能手机 透过W-iFi控制Google TV的方法。Optimized Templates的界面中左方会展示分类,右方会显示该分类下的影片截图,影片播放、切换、全画面表示都可透过键盘上的方向键、Backspace或 Enter等键完成,方便今后的网站开发人员借镜。HTML5 版的模板使用了 Google TV UI library, jQuery 和 Closure.

from https://coolshell.cn/articles/4795.html
----------

Best “must know” open sources to build the new Web

Here the dump of my ultimate collection of online Web development resources and directories, oriented for the Front-End users Interfaces (UI).
HTML5 and all related open standards are moving fast, but for now, building a whole Website/WebApp on top of that can be very inconsistent, especially across various browsers experiences.

So… how to embrace new awesome web technologies ?
Now, as Web Developers and Designers, we have to build on top of more stable framework. It’s here that come JavaScript jQuery, acting like interface into browser’s implementations. That how we can expect more stability and consistency.
There is not only JS, building a state-of-the-art webSite. That now like making a big movie, with hundred specialized tasks and jobs…
From A to Z, this is huge ! Even if i think we don’t need to be an expert for all… (Thus we try) ^^
Best things in life are free, time to learn !

LEARNING HTML 5, CODING AND DESIGN

  • ★ HTML5 Rocks : Learn HTML5 by Major Feature Groups  (HTML5 Demos, tutos and playground). Sources by Google
  • Awesome HTML5 Dashboard by Mozilla
  • WhatWG Developers, A clear technical specification of HTML5 for Web developers
  • ★ StackOverflow : Welcome to Q&A for professional and enthusiast programmers
  • ★ Addyosmani, jQuery & JavaScript articles and tutorials for the community
  • Sohtanaka, jQuery & JavaScript articles and tutorials for the community
  • ★ Nettuts+ is a site aimed at web developers and designers offering tutorials and articles on technologies, skills and techniques to improve how you design and build websites. We cover HTML, CSS, Javascript, CMS’s, PHP and Ruby on Rails.
  • Codrops, tutorials and web resources
  • WebAppers, best Open Source Resources for Web Developers
  • Tutorialzine – PHP MySQL jQuery CSS Tutorials, Resources and Freebies
  • Mozilla JavaScript guide for developers
  • WebDev and jQuery wiki codes snippets, compiled by myself ;)

SERVER SIDE SOFTWARES

  • ★ Node.js is a server-side JavaScript environment that uses an asynchronous event-driven model. This allows Node.js to get excellent performance based on the architectures of many Internet applications. Sources and live demo.
  • PhantomJS is a server-side headless WebKit with JavaScript API. It has fast and native support for various web standards : DOM handling, CSS selector, JSON, Canvas, and SVG
  • Lighttpd is a lightweight open-source web server. News, documentation, benchmarks, bugs, and download. Lighttpd powers several popular Web 2.0 sites like YouTube, wikipedia and meebo.
  • NGinx, high performance and lightweight web server as well as a reverse proxy and e-mail platform
  • The Apache HTTP Server Project is an effort to develop and maintain an open-source HTTP server for modern operating systems
  • ★ PHP :  Hypertext Preprocessor. Server-side HTML embedded scripting language. It provides web developers with a full suite of tools for building dynamic websites
  • FFmpeg – Tools to record, convert, stream and play multimedia content including libavcodec and libavformat, two libraries used by many other open source projects
  • And… Ruby, Python, Erlang, Perl, Java, .NET, Android, C++, Go, Fantom, CoffeeScript, D, …

PHP FRAMEWORKS AND TOOLS

  • ★ WordPress is web software you can use to create a beautiful website or blog
  • Drupal is an open source content management platform (CMS).
    Come for the software, stay for the community
  • Centurion is a new open-source CMS delivered as a flexible PHP5 Content Management Framework. We simplify the use of Zend Framework, which is ZF extended. Our components are generic, simple, clear and reusable.
  • phpBB is a free flat-forum bulletin board software solution
  • SPIP est un système de publication pour l’Internet (CMS) qui s’attache particulièrement au fonctionnement collectif, au multilinguisme et à la facilité d’emploi. C’est un logiciel libre, distribué sous la licence GNU/GPL
  • MediaWiki is a free software open source wiki package written in PHP, originally for use on Wikipedia
  • ★ SimplePie : Super-fast, easy-to-use, RSS and Atom feed parsing in PHP
  • ★ PHPthumb, PHP image manipulation library
  • ★ PHPMailer is a fully featured email transfer class for PHP
  • A simple, open, server-to-server web-hook-based pubsub (publish/subscribe) protocol as an extension to Atom and RSS. Parties (servers) speaking the PubSubHubbub protocol can get near-instant notifications

DATABASE MANAGEMENT

  • ★ Apache CouchDB provides a RESTful JSON API than can be accessed from any environment that allows HTTP requests and allow document-oriented database that can be queried and indexed in a MapReduce fashion using JavaScript. CouchDB also offers incremental replication with bi-directional conflict detection and resolution. Sources.
  • MonoQL is an AJAX web application to manage MySQL databases. MonoQL will provide all major features of phpMyAdmin for MySQL, including database & table design, data browsing & editing, advanced querying & more
  • MariaDB is a community-developed branch of the MySQL database, under GPL status, as opposed to any uncertainty of MySQL license status under its current ownership by Oracle.
  • ★ SQLite is a software library that implements a self-contained, serverless, zero-configuration, transactional SQL database engine.
  • SQL online designer editor

API AND ONLINE DATA

  • ProgrammableWeb, Most Popular Web Services and API Directory
  • The following Google services provide APIs that implement the Google Data Protocol. Each API has its own set of guides and resources, including information about using client libraries
  • Yahoo! Developer Network – APIs & Tools
  • Yahoo! Pipes An interactive feed aggregator and manipulator
  • ★ The Yahoo! Query Language is an expressive SQL-like language that lets you query, filter, and join data across Web services

ONLINE CODE AND MEDIA EDITING

  • ★ CodeRun Studio is a cross-platform Integrated Development Environment (IDE), designed for the cloud. It enables you to easily develop, debug and deploy web applications using your browser.
  • ★ Cloud9 IDE – by javascripter for javascripters (GOOD GOOD GOOD :)
  • ★ jsFiddle – Simple and powerfull online editor for the Web (JavaScript, MooTools, jQuery, Prototype, YUI, Glow and Dojo, HTML, CSS)
  • Akshell, a server-side JavaScript development and hosting. Create web apps in JavaScript right from your browser
  • JSONeditor, easy editing of json strings
  • ★ TinyMCE is a powerful WYSIWYG editor control for web browsers such as MSIE or Mozilla that enables the user to edit HTML content in a more user friendly way
  • Ext Designer is a desktop application that helps you create interfaces faster than ever in an easy-to-use, drag-and-drop environment.
  • ★ Wireframes / UI Design  From static wireframes to rapid prototypes, web developers can do it all with LucidChart. Collaborate with your client and design team in real-time to cut down on iterations.
  • Balsamiq Mockups, online sketch helping you in your design
  • Color Scheme Designer 3
  • ★ Pixlr, Photoshop like image editing direct in your browser
  • Aviary, free online photo editor. Plus Aviary API for developers
  • Favicon Generator

CODE RESOURCES AND VERSION CONTROL

  • ★ GitHub is the best way to collaborate with others. Fork, send pull requests and manage all your public and private git repositories.
  • Git is an extremely fast, efficient, distributed version Source Code Management tool ideal for the collaborative development of software.
  • Google Code est destiné aux développement relatif à Google. L’entreprise y diffuse des codes sous licence libre ainsi que la liste des API utilisables
  • The Google Libraries API is a content distribution network (CDN) and loading architecture for the most popular, open-source JavaScript libraries
  • Code Snippets, Snipplr Social Snippet Repository

JAVASCRIPT FRAMEWORKS FOR DESKTOP

  • ★ jQuery is a fast and concise JavaScript Library that simplifies HTML document traversing, event handling, animating, and Ajax interactions for rapid web development. Sources, API, API Browser, Fancy Doc.
  • ★ The official jQuery User Interface (UI) library (Demos and Doc). Sources, Themes Roller, Download.
  • jQuery TOOLS – The missing UI library for the Web
  • YUI 2 — Yahoo! User Interface Library
  • Mootools, a super lightweight web2.0 JavaScript framework
  • Prototype provides class-style Object Oriented and AJAX
  • Dojo unbeatable JavaScript Tools – The Dojo Toolkit
  • ★ EXT4, the industry’s most advanced JavaScript framework for building the next generation of cross-platform web apps.
  • PHP.js, PHP functions implemented client-side in JavaScript

JAVASCRIPT FRAMEWORKS FOR MOBILE AND TOUCH

  • ★ jQuery Mobile : Touch-Optimized Web Framework for Smartphones & Tablets
    A unified user interface system across all popular mobile device platforms, built on the rock-solid jQuery and jQuery UI foundation. Sources.
  • Zepto.js is a minimalist inlinable framework for mobile WebKit browsers, with a jQuery-like chaining syntax. Sources.
  • MicroJS : Fantastic Micro-Frameworks and Micro-Libraries for Fun and Profit !
  • ★ PhoneGap : Embed your code and access core functions on Android, iPhone and Blackberry using JavaScript. Sources.
  • ★ Sencha Touch allows you to develop mobile web apps that look and feel native on iPhone, Android, and BlackBerry touch devices
  • JQtouch, a jQuery plugin for mobile web development on the iPhone, Android, iPod Touch, and other forward-thinking devices. Sources.
  • DHTMLX Touch is an HTML5-based JavaScript library for building mobile web applications. It’s not just a set of UI widgets, but a complete framework that allows you to create eye-catching, cross-platform web applications for mobile and touchscreen devices

JQUERY PLUGINS

  • jQuery Waypoints is a small jQuery plugin that makes it easy to execute a function whenever you scroll to an element with or without infinite scrolling enabled
  • This jQuery plugin is an on-demand plugin loader, also known as a Lazy loader
  • TweenJS : A simple but powerful tweening / animation library for Javascript
  • Css3-like Easings for jQuery animations
  • Spritely is a jQuery plugin for creating dynamic character and background animation (Pan, Scroll, Sprite)
  • Timeline.js is a compact JavaScript animation library with a GUI timeline for fast editing
  • jQuery File Upload User Interface Plugin 4.4.1
  • JQuery Slideshow/Carousel Plugin. Sources.
  • Flux Slider Transitions Gallery, hardware accelerated image transitions using CSS3
  • Roundabout for jQuery, 3D effect carousel with sprites (Div) that turn around an axe
  • Supersized – Full Screen Background/Slideshow jQuery Plugin
  • jQuery Masonry is a layout plugin for jQuery that arranges elements vertically then horizontally according to a grid, minimizing gaps. Sources.
  • jQuery simple Layout Demo that manage slidable and resizable, multi-pane
  • Flexigrid jQuerydatagrid plugin
  • SlickGrid is a JavaScript grid/spreadsheet component
  • Isotope, an exquisite jQuery plugin for magical layouts Reveal & hide items with filtering Re–order items with sorting Dynamic, intelligent layouts
  • The Super Gestures jQuery plugin records gestures made by the user’s mouse. This is great for touch interface web applications
  • jQuery MouseWheel is a plugin that adds cross-browser mouse wheel support
  • AutoSuggest jQuery Plugin, add some auto-completing functionality
  • qTip is an advanced tooltip plugin it provides you with tonnes of features like rounded corners and speech bubble tips
  • jQuery Charts and graphic tool
  • jQuery Tools – The missing UI library for the Web

OTHER JQUERY RESOURCES


HTML5 VIDEO PLAYERS

  • ★ Popcorn.js is an event system for HTML5 Video, with strong syntactic sugar for chaining < video > methods and adding events to the timeline. (From Mozilla)
  • LeanBack Player HTML5 Video Player with Subtitle-Support (From Google)
  • A single URL for your video. Vid.ly keep up to date with the thousands of smart phones, features phones, and tablets on the market and which type of video they support. When a mobile device visits your vid.ly url we deliver up the correct video format

JAVASCRIPT AUDIO PROCESSING AND VISUALISATION

  • ★ Using HTML5 and Flash, SoundManager V2 provides reliable, simple and advanced, cross-platform audio under a single API
  • DSP, sound Digital Signal Processing for JavaScript
  • The Radiolab Hyper Audio Player v1, brought to you by WNYC Radiolab, SoundCloud and Mozilla Drumbeat
  • jPlayer, a jQuery HTML5 Audio / Video Library with comprehensive API

JAVASCRIPT GRAPHICS AND 3D

  • ★ Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins
  • ★ Javascript 3D Engine : ThreeJS by Mr Doob
    The aim of the project is to create a lightweight 3D engine with a very low level of complexity — in other words, for dummies. The engine can render using <canvas>, <svg> and WebGL.
  • Shader Toy, online shaders visualizer and editor (2D/3D)
  • PhiloGL, a WebGL Framework for Data Visualization, Creative Coding and Game Development
  • What Firebug and Developer Tools are to HTML/JS, WebGL Inspector is to WebGL
  • WebGL frameworks listed by the Khronos Group
  • jCanvaScript is a JavaScript library that provides you methods to manage with the content of a HTML5 canvas element easily, like jQuery [NEW]
  • EaselJS, a JavaScript library for working with the html5 canvas element. Sources.
  • Free JavaScript Game Frameworks To Create A Web-Based Fun
  • Raphaël is a small JavaScript library that should simplify your work with vector graphics on the web (SVG). If you want to create your own specific chart or image crop and rotate widget, for example, you can achieve it simply and easily with this library.
  • jQuery SVG plugin that lets you interact with an SVG canvas
  • Display live data on your site Google chart tools are powerful, simple to use and free. Try out our rich gallery of interactive charts and data tools.
  • Arbor.js, a graph visualization library exploring nodes and relations and using web workers and jQuery

JAVASCRIPT BROWSERS INTERFACES (HTML5)

  • ★ Modernizr – Feature detect HTML5 and CSS3 features, with handy css and javascript hooks so you can progressively enhance to your heart’s content. Sources. Useful list of cross-browser Polyfills
  • HTML5Shiv : The latest HTML5 JavaScript shim for IE to recognise and style the HTML5 elements
  • Polyfills : A way of getting the browser to behave and support the latest specifications. This is a collection of code snippets that support different native features of browsers using JavaScript (and if required, Flash in some cases).
  • YepNopeJS : An Asynchronous Conditional Resource Loader helping detecting browser missing features. Sources.
  • jQuery CSS3 Finalise : Tired of adding prefix for each browser when it comes to the new CSS3 attributes ?
  • ★ Amplify.js : Store, request and pub/sub. Amplify API  goal is to simplify all forms of data handling by providing a unified API for various data sources. Amplify’s store component handles persistent client-side storage, using standards like localStorage and sessionStorage, but falling back on non-standard implementations for older browsers. Sources.
  • History.js gracefully supports the HTML5 History/State APIs
  • Socket.IO aims to make realtime apps possible in every browser and mobile device

JAVASCRIPT TOOLS

  • ★ Minimal templating with {{mustaches}} in JavaScript
  • json:select(), CSS-like selectors for JSON
  • HeadJS, Asynchronus JavaScript loading. The only script in your <HEAD>
  • JsDoc Toolkit is an application, written in JavaScript, for automatically generating template-formatted, multi-page HTML (or XML, JSON, or any other text-based) documentation from commented JavaScript source code.
  • Responsive image, an Experiment with Mobile-First Images that Scale Responsively & Responsibly
  • UglifyJS JavaScript API, to compress JavaScript code
  • Dhteumeuleu, interactive DOM scripting and DHTML open-source demos, powered with native JavaScript
  • Backbone give your JS App some Models, Views, Collections, and Events
    Backbone supplies structure to JavaScript-heavy applications by providing models key-value binding and custom events, collections with a rich API of enumerable functions, views with declarative event handling, and connects it all to your existing application over a RESTful JSON interface.

CLIENT SIDE AND EMULATING

CSS3 and FONTS

  • ★ The dynamic stylesheet language. LESS extends CSS with dynamic behavior such as variables, mixins, operations and functions
  • The Semantic GRID system. Set column and gutter widths, choose the number of columns, and switch between pixels and percentages
  • ★ Twitter Boostrap Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more [NEW]
  • ★ CSS3 Maker and generator
  • Create amazing WebKit CSS3 animations with ease.  Sencha Animator is a desktop app to create CSS3 animations for WebKit browsers and touchscreen mobile devices. Create rich experiences for today’s most popular devices.
  • CSSwarp – CSS Text to Path Generator
  • Gradient Editor, a powerful Photoshop-like CSS gradient editor from ColorZilla
  • ★ Google Web Fonts lets you browse all the fonts available via the Google Web Fonts API (open source license)
  • @font-face Kit Generator, convert fonts for the Web
  • Typetester, compare fonts for the screen
  • Media Queries. a collection of responsive web designs
  • Pattern TAP, Users Interface (UI) components

WEBSITE (FULL) TEMPLATES

  • ★ HTML5 Boilerplate A rock-solid base HTML/CSS/JS template for HTML5 awesome, for a fast, robust and future-proof site.
    After more than three years in iterative development, you get the best of the best practices baked in : cross-browser normalization, performance optimizations, even optional features like cross-domain Ajax and Flash. A starter apache .htaccess config file hooks you the eff up with caching rules and preps your site to serve HTML5 video, use @font-face, and get your gzip zipple on. Sources.
  • HTML5 starter pack is a clean & ordered directory structure that fit for most projects, a few of the most common files (html, css, js), as well as a basic Photoshop web design template, again with an groups structure fit for most projects.
  • ★ Initializr is an HTML5 templates generator to help you getting started with an HTML5 project, in 15 seconds !
  • Animated Portfolio Gallery with jQuery
  • Making a Slick MobileApp Website with jQuery & CSS
  • How to Build an RSS Reader with jQuery Mobile
  • ★ Building Single Page Applications With jQuery’s Best Friends (Backbone, Underscore, …)
  • Google TV Optimized Templates, to make website optimization for TV easier, we are providing templates – 2 in HTML5 and 2 in Flash – that developers can download and modify with their own content and style. The HTML5 version of these templates are utilizing the Google TV UI library, jQuery based and Closure based. The UI library can be used independent of the templates.


I know this is a monkey list ! Keep calm, you don’t have to read all… at least if you click on all starred links, it’s cool ;)

PS : Come take a look to my browser start page portal, giving WebDev an efficient access to Web resources… And don’t forget #TAG searches in this site :)
PS2 : Thanks a lot to #FOWD providing me wifi connection and inspiration ;)

from http://web.archive.org/web/20121217184635/http://www.b2bweb.fr:80/molokoloco/best-must-know-ressources-for-building-the-new-web-%E2%98%85/

移动应用设计中应避免的十种错误

导读:本文是来自移动应用开发公司Sourcebits系列文章Mobile App Trends Series(译者:此网站要梯子)中的一篇,文章内容适合初涉此领域的读者,现翻译如下。

  在了解了跨平台移动应用设计的利弊和移动应用开发常见错误之后,你想到了一个不错的应用创意,你甚至连应用的名字都想好了,接下来该干什么?
   现在,我们要谈谈设计了。你需要考虑移动应用的功能结构、用户流程等问题,而这些并不是那么容易。考虑到进入开发阶段我们会涉及到诸如需求变动、项目管 理等棘手的问题,所以在设计阶段,我们需要给自己制定一些原则,并且要切合实际的开展工作。这样我们才能开发出一款好用又有趣的应用。忽略这些潜在的问题 而盲目瞎干,你很有可能在此后的开发阶段陷入灾难。
  本文试图帮助移动应用设计者在工作中避免一些难缠的麻烦,希望你的应用以及你的设计思路均能因此受益。
  错误1. 在弄清用户流程之前匆忙开始界面(草图)设计
   在开始界面设计前,我们要先把完整的用户流程详细的走通顺走清楚。哪怕是再简单的应用,为了确保用户流程逻辑正确、界面布局合理,我们需要反复推敲用户 流程并绘制类似上面的流程图。另外值得注意的是,最好把关键功能绘制在流程图靠近顶部的地方,而不是被层层分支淹没在底部。
  跳过此环节而草率的开始界面设计,最终开发出的应用很可能在使用流程上不够清晰合理,用户上手后不得其解,兴趣索然。
  错误2. 低估开发成本
  设计师在Photoshop中画出的任何东西,最终都需要通过开发人员的代码在屏幕上表现。原本只需几小时开发的功能,由于设计师的一个看似细微的改动,可能会多耗费几天的开发时间。所以,在设计过程中要避免画蛇添足。
   换句话说,如果设计师主导了移动应用功能的取舍,那后果会很严重。举个搜索框的例子,原本相对简单的一个功能,设计师灵光乍现——在用户输入关键词的同 时不断给出实时的搜索结果。这个看似细节的改动,很可能让开发人员当场吐血。像这种的功能改动最好经过多方讨论后做出决策,而不是任由设计师自说自话。
  错误3. 在低分辨率下设计,使用位图文件
   始终坚持为Retina屏幕的高分辨率绘制设计图,然后以此输出低分辨率版本图片。这对于老手来说是常识,我们在这里再啰嗦几句。大家都知道,移动设备 的常见屏幕尺寸是越来越五花八门(以iOS平台 为例,迄今需要考虑的就有4种分辨率)。所以,绘制高分辨率版本的图片,甚至是使用矢量图而不是位图,这些有助于设计师效率最大化,以及更好的应对未来的 新硬件。
  错误4. 触摸区域太小
  普通人的食指触摸面积在1.6至2厘米见方,而 且在使用移动应用的大多数时间里,他们的手指飞快的掠过屏幕。设计移动应用界面需要时刻提醒自己这一点,用户的触摸并不能像鼠标点击一样精确。看看你的设 计是不是在一屏里包含了太多的按钮等功能触发点,按钮是不是足够大,间距是不是足够宽,会不会发生用户点选不到或者误按其它按钮的问题?
  错误5. 滥用开场动画
  在启动时播放一段精致的动画似乎是个不错的想法,但切忌不要为了动画而动画。Path和Thrillist’s JackThreads使用很酷的开场动画是因为这些应用启动需要一些时间,在程序完成加载之前用户什么也不能做(译者:Path启动貌似没有啥动画,难道是针对老版本说的?)。这种情况下,为用户准备一段简短愉悦的动画以消除等待的焦虑就显得很合时宜了。
  由于应用启动时必须首先显示一张静待图片(译者:如iOS应用的Default.png),然后才能切换到动画,所以务必确保这个切换看起来天衣无缝。一些不好的例子在处理这个环节的时候产生了不协调的跳转或者闪屏,这都是需要避免的。(译者:优酷iPad应用的早期版本存在这种切换,处理中有一闪而过的黑屏,现在的版本把动画直接去掉了)
  错误6. 让用户不知所措的原地等待
  在程序加载、处理数据、或者等待网络反馈时不给用户及时的反馈,会让用户误认为应用挂了,这也是一种不好的用户体验。
  举例来说:通过网络加载数据的同时,不要让用户傻傻的盯着一个空白的屏幕等待,显示一个转菊花或者动画特效什么的,让用户明白应用运行正常,只不过是在等待网络数据。如果能显示数据读取的进度条那就更好了,不过事先和开发人员商量一下开发难度(参考本文第二点)。
  错误7. 盲目借鉴其它移动平台风格
   糟糕的抄袭只会让用户感到疑惑和愤怒。每一个移动平台都有自己的风格,平台厂商也已经依据其平台自身的审美诉求撰写类似苹果的Human Interface Guidelines之类的指导性文档(译者:Android现在也有类似的文档)。在iPhone上开发类似Windows Phone 7的Metro风格应用就很可能让习惯了iOS的用户感到无从下手。
  我想说的是,你的应用并不一定要和官方应用一模一样,但也不能看起来另类到像不属于这个平台一样。
  错误8. 过分拥挤的界面
   在高PPI下设计移动应用界面,你可能不知不觉中就在一个屏幕里放了太多的东西。在27″的iMac屏幕上看设计图,你的设计是那么的赏心悦目。请在移 动设备上再多看一眼(哪怕仅仅是把设计图导入手机相册看),可能就不是那么回事了。在一个屏幕内塞太多的元素,会让用户操作起来费力,甚至淹没了最重要的 信息。
  错误9. 认为所有用户都和你一样的使用应用
  无论你的应用界面看起来有多 赞,都要做可用性测试。你可以在熟人圈内开展小规模的beta测试,记住让一些资深的设计师也参加。根据他们的反馈,在最终发布前调整界面。你也可以在 Craigslist上发布广告,邀请一些学生来试用新产品,记得提供比萨或者一点报酬什么的。
  错误10. 忘记使用或者滥用手势操作
  记住并不是所有界面元素都必须直观的被用户看到,有时我们可以隐藏一些惊喜。
  拿iPhone上面的官方邮件应用 (译者:又是老生常谈的例子), 用户可以在收件箱中通过横扫邮件标题激活删除功能,这就免去了用户点击“编辑”、选择邮件、选择删除的麻烦。这里我们发现有个平衡点:老用户可能发觉出用 手势完成快速删除,同时保留“编辑”按钮以便不熟悉的用户完成删除、标记等其它操作。所以,善用手势但不能过分倚重手势,一般来说要最好不要用手势操作替 代菜单等需要点选操作的界面元素。
  总结
  如果要用一句话概括文本提到的点点滴滴,那就是:好的设计是经过深思熟虑的。带着审慎的态度全面的考察你的设计,真正的从用户的角度出发想问题。不要试图走走捷径,也不要跳过测试,不要设计出连你自己都拿不出手的东西。
  英文原文:mashable 

军统“七姐妹花”宁死不降

军统“七姐妹花”合影照片。最年轻的姚姓译电员因手雷没有爆炸而未死,但坠崖后四肢骨折,无力移动。四天后被亲中国的克钦族游击队发现,终因伤势过重,留下最后的叙述后,也瞑目异国。

军统是国民政府军事委员会调查统计局的简称,是国民党政权于1938年8月成立的情报机构组织。中共 夺权后拍摄的许多反映国共内战的影视作品中,都有军统女特务出场的镜头,但那基本上是作为反面角色的坏人。其实作为当时中国政府的情报机关,军统在抗日战 争中为中国立下汗马功劳,其中在缅甸战场,就有军统七位姐妹花为国捐躯的事迹。
日本1940年9月入侵越南,切断了中越通道,威胁中国国际交通要道——滇缅公路的安全,并且把侵略矛头指向缅 甸、马来西亚、新加坡等英属殖民 地。美国、英国两国政府协商决定成立盟军中国战区统帅部,将法属印度支那和泰国境内联合国军队拨归中国战区指挥,由蒋介石任统帅,美国将军史迪威任参谋长 兼驻华美军总司令。
中印缅战区成立后,中国远征军入缅作战。中国远征军由杜聿明指挥,军统随即派出人员随同远征军出发,其中就有一批训练班的女学员,到远征军中担任译电员。
因为和美英军配合不力,远征军经过苦战,终于失利。孙立人部新三十八师退往印度,在孙立人部的七名军统女译电员随同撤退。由于当时日军已经控制了主要交通要道,前进速度很快,远征军撤退中不断遭到日军的袭击,伤亡惨重。
当他们退到印缅边境的当坡时,电台突遭日军的伏击。战斗十分短促,因为当时中国士兵已经弹尽力竭。
转眼周围的掩护人员全部牺牲,剩下的七名军统女译电员被敌人追到一个山坡上。看到突围无望,这七名女特工人员砸毁电台,宁死不屈,每人高呼一声“中华民国万岁!”即拉响手雷,跳下山崖,没有一个被日军俘虏。
七人中只有一个最年轻的姚姓女译电员因手雷没有爆炸而未死,但坠崖后四肢骨折,无力移动。四天后,被亲中国的克钦族游击队发现,终因伤势过重,留下最后的叙述后,也瞑目异国。
新三十八师是远征军中损失最小的部队,其他部队沿野人山撤退,竟有活活被蚂蚁吃掉的惨剧,连二〇〇师师长戴安澜也壮烈战死。但是,即便是损失最小的新三十八师,其突围竟然也如此惨烈。
军统在当年的4月1日的成立纪念日上,对殉国的七名女译电员进行了隆重的追悼,军统唯一的女少将姜毅英亲致祭词,并在重庆缫丝厂她的办公室窗外,种下了七枝连根的美人蕉,军统人员称为“七姐妹花”.