Skip to content

Latest commit

 

History

History
505 lines (369 loc) · 22.2 KB

software.md

File metadata and controls

505 lines (369 loc) · 22.2 KB

TODO

2015-5-5 看下还有什么软件是可以在电脑管家里面安装的? 看是否有遗漏的什么软件 还差mactype没有放进来

更多的常用网站需要更新, 还有其他团队软件, 需要更新

前端工程师常用软件(Windows7 x64)

从2010年5月13号开始构思出一套属于自己的"云端"工作空间, 主要是想整理出自己最常用的绿色软件和习惯配置, 期间不断优化调整完善使用至今, 事实证明这套"云端"工作空间是高效且值得信赖的, 可以以最快的速度在一台新电脑上搭建出自己熟悉的工作环境, 也算是自己多年来对各种软件的总结.

原来这套系统主要托管在Google Code上, 但是由于Google Code要关闭了, 因此不得不转移到 Github 上来.

还有一些前端工程师常用软件(备选项)

v0.0.1 2015-5-5(还未正式发布版本)

个人软件

前端开发必备

  • Sublime Text

    我最称手的兵器

    _Cloud\Google\Code\sync-software\development\Sublime Text

  • Chrome | DevTools tips

    _Cloud\Tencent\QQMail\GoogleChromePortable

    • 前端便捷工具
      • WEB前端助手(FeHelper)
      • css auto reload(当页面中的 CSS 修改后, 仅刷新 CSS 而不刷新页面)
      • Web Developer
      • Web Developer Checklist(Analyses any web page for violations of best practices)
      • PrettyPrint(JavaScript and CSS formatter/syntax highlighter)
    • 框架调试工具
      • jQuery Audit
      • AngularJS Batarang
      • React Developer Tools
      • Vue.js devtools
      • 微信调试工具
      • Ripple Emulator(A browser based html5 mobile application development and testing tool)
    • 适配调试工具
      • Emmet Re:view(Fast and easy way to test your responsive design in multiple viewports)
      • Responsive Inspector Reloaded(inspecting page media queries)
      • Responsive Web Design Tester
    • 性能分析
      • Chrome Sniffer Plus(探测当前网页正在使用的开源软件或者js类库)
      • JavaScript Errors Notifier(Notifies JavaScript errors by icon in toolbar bar or notification popup)
      • Page load time(Displays page load time in the toolbar)
      • YSlow
      • SimilarWeb(查看真实的深入网站参与、流量来源和网站排名信息)
    • 辅助工具
      • Postman(Build, test, and document your APIs faster)
      • Postman Interceptor(Sends requests fired through the Postman chrome app)
      • Grid System
      • AlloyDesigner(A web front-end development tool,前端重构开发辅助工具)
    • 日常工具
      • OneTab
      • Vimium(provides keyboard shortcuts for navigation and control in the spirit of Vim)
      • 印象笔记·悦读(使博文、文章和网页变得简明而又易于阅读)
      • Image Properties Context Menu(show the properties of an image)
      • Light Markdown Editor
      • Send to Kindle for Google Chrome
      • Adblock Plus
      • 购物比价助手

  • Node.js

    常用模块安装脚本

    npm install puer browser-sync weinre grunt-cli gulp-cli harp hexo-cli flex-combo anyproxy supervisor node-inspector sails nodeppt surge -g

    npm ls -depth 0 -g

  • Puer

    more than a live-reload server , built for efficient frontend development

    puer -i -t http://localhost:8080 -a route.js

  • Photoshop

    Adobe提供了免费的老版本Photoshop CS2, 只有英文版

    常用快捷键

    • 按住空格键 + 鼠标拖拽 | 移动画布
    • alt + 鼠标滚轮 | 放大/缩小画布
    • alt + 鼠标单击某图层眼睛图标 | 显示/隐藏所有其他层, 即仅显示某图层
    • ctrl + ; | 显示/隐藏参考线
    • ctrl + alt + shift + e | 新建盖印图层, 即新增一个所有可见图层合并后的图层

    切图法(使用 Photoshop CC 2014)

    • 选中图层 + 图层选区(ctrl + 鼠标单击图层缩略图/ctrl+d[取消选择]) + 拷贝(合并拷贝) + 文件/新建(剪贴板) + 粘帖

    • 选中图层(可多个) + (合并图层) + 复制图层 + 文档/新建 + 裁切(基于透明像素)

    • 切片工具(适合整块的切类似图片拼接的页面) + 参考线 + 存储为 Web 所用格式(可以在存储时选择"选中的切片")

    • 切图插件(PS扩展)

    • Photoshop CC 2014 自动切图(自动导出图片资源)

      开启方式

      1、 首选项 - 增效工具 - 启用生成器

      2、 文件(菜单) - 生成 - 图像资源

      3、命名图层为 xxx.png 或者 xxx.jpg 即可

      4、{PSD名}-assets 文件夹中就会出现我们想要的切图了

    • Photoshop CC 2014 选中图层 + 复制 CSS

    • Extract CSS/image/text by Adobe Creative Cloud

  • NW.js

    node-webkit is renamed NW.js, You can write native apps in HTML and JavaScript with NW.js. 感觉现在Electron更加成熟, 还有比较久远一点的heX. 如果是开发App, 可以试一试Cordova/Cocoon.

  • CasperJS

    a navigation scripting & testing utility for PhantomJS and SlimerJS written in Javascript. 另外可选的还有Nightmare

前端开发效率

  • BrowserSync

    不仅可以免刷新, 还能同步各个设备上打开页面时的交互, 例如滚动某一个设备上的页面其他设备该页面同时都会滚动到相同位置, 还集成了远程调试(weinre)功能, f5差不多可以退休了.

    browser-sync start --server --directory --port 4000 --files "**/*.html, **/*.css"

    browser-sync init

    browser-sync start --config bs-config.js

  • Grunt | Gulp

    JavaScript Task Runner 常用Grunt任务(TODO添加更多常用任务, 写到外面的grunt文件中)

  • GNU Wget

    use wget to download all the HTML from a webpage along with the CSS, Images, JS, etc. A bonus feature would be if it could even rewrite URLs and even grab images referenced in CSS files. 简而言之就是可以一下抓出别人的页面, 把所有相关资源全部本地化, 也可以试一试HTTrack Website Copier, 当然 node-website-scraper也是一个非常不错的选择, 你甚至可以临时用一下作者写的 website-scraper online

    _Cloud\Google\Gmail\wget

    wget -mk http://www.example.com

  • CssGaga

    制作 CSS sprite 非常方便, 拖拽图片就能够生成单个图标的CSS样式(包含图片url, 自动填好宽高, 爽吧), 再将这个CSS拖拽一次就能合并所有图片生成 sprite, 并更新CSS样式调整为使用background-position

    _Cloud\Google\Gmail\CssGaga

  • PxCook像素大厨

    不再为标注切图而烦恼, 可用来替代 MarkMan, 然而还有更猛的切图神器 Avocode Export and share anything from Photoshop & Sketch designs Colors, image assets, fonts, text, CSS, sizes and dimensions.

    _Cloud\Google\Gmail\PxCook

  • AnyProxy

    A fully configurable proxy in NodeJS, which can handle HTTPS requests perfectly

  • Fiddler

    The free web debugging proxy for any browser, system or platform

    _Cloud\Google\Gmail\Fiddler2

    记得配置 Tools/Telerik Fiddler Options/Connections/Allow remote computers to connect 才能在移动设备上设置 WiFi 网络的代理来拦截移动设备上的 HTTP 请求

    AlloyTeam/Rosin

    Fiddler插件，协助开发者进行移动端页面开发调试，是移动端web开发、调试利器

    • 拦截 console, 支持复杂对象的 JSON 解析

      对于复杂对象，双击Object字符区域选中，然后右键, 复杂对象都会被转为JSON对象，生成一个JSON View

    • 脚本运行错误捕获

      javascript运行时错误信息捕获，并且支持跨域情况下的捕获

  • Flex Combo

    Combo技术是在服务端提供合并多个文件请求在一个响应中的技术, Flex Combo是在开发环境模拟实现了此功能的服务器，目的是方便前端开发调试。约等于一个支持Combo语法，只能访问js、css、iconfont等静态资源的Web服务器

  • Harp

    The static web server with built-in preprocessing. Harp serves Jade, Markdown, EJS, CoffeeScript, Sass, LESS and Stylus as HTML, CSS & JavaScript—no configuration necessary.

    需要先安装 git 和 python

    harp init myproject

    harp server myproject

    harp compile myproject

  • supervisor

    Node Supervisor is used to restart programs when they crash.

  • node-inspector

    Node Inspector is a debugger interface for Node.js applications that uses the Blink Developer Tools (formerly WebKit Web Inspector). 联合使用 node-inspector + supervisor 堪称 nodejs 领域的F5!

    node-inspector

    supervisor --debug-brk debugme.js

    Visit http://127.0.0.1:8080/

  • ngrok

    I want to expose a local server behind a NAT or firewall to the internet. ngrok lets you expose a locally running web service to the internet. Just tell ngrok which port your web server is running on. 国内 ngrok 服务

    ngrok http 3000 -subdomain myapp

    _Cloud\Google\Gmail\ngrok.exe

  • Surge

    Static web publishing(Free custom domain support) for Front-End Developers

    surge list

    surge --domain ufologist.surge.sh

    surge teardown ufologist.surge.sh

  • Apache

    主要用ab工具做测试

    _Cloud\Google\Gmail\apache

    ab -n 10 -c 5 http://qq.com/

    abs -n 10 -c 5 https://mp.weixin.qq.com/

  • Sails

    Sails is a lightweight framework that sits on top of Express. Sails makes it easy to build custom, enterprise-grade Node.js apps. It is designed to emulate the familiar MVC pattern of frameworks like Ruby on Rails.

    sails new sails-demo

    cd sails-demo

    sails lift

    或者试一试 IBM 出品的StrongLoop可以快速的Compose APIs, Build, Deploy and Monitor Node

  • IETester

辅助工具

  • JDK

  • RailsInstaller

    顺带了Git

    日常一般使用 TortoiseGit 和 vscode 自带的 git 功能即可, 如果有更加高的要求, 可以使用 SourceTree

  • Python

  • ConEmu

    Customizable Windows terminal with tabs, splits, quake-style

    _Cloud\Google\Code\sync-software\ConEmu

  • Cygwin Get that Linux feeling - on Windows

  • nginx

    HTTP服务器, 主要用做反向代理和负载均衡, 用 openresty 也可以

    _Cloud\Google\Code\sync-software\nginx

    _Cloud\Google\Code\sync-software\openresty

    nginx

    nginx -V

    nginx -t

    nginx -s reload

    nginx -s stop

  • TortoiseSVN

    _Cloud\Google\Gmail\TortoiseSVN-1.6.8.19260-win32-svn-1.6.11

  • Microsoft Network Monitor

    Network Monitor 3.4 is the archive versioned tool for network traffic capture and protocol analysis.

  • Wireshark

    _Cloud\Google\Gmail\WiresharkPortable

  • Mockplus

    更快、更简单的原型设计

  • Mark Man

    1.40.7是最后一个免费版本(按住ctrl进行自动测量), 需要先安装AIR环境. 现在版本收费了, 使用会有一些功能限制

    _Cloud\Google\Gmail\MarkMan_1.40.7.air

项目方案

  • CMS

  • AOS

  • G4Studio

  • JFinal_Authority

  • JECP jfinal + easyUI+activiti 企业协同平台

  • s2jh4net

  • JeeSite

    企业信息化开发基础平台，Java企业应用开源框架，Java EE（J2EE）快速开发框架，使用经典技术组合（Spring、Spring MVC、Apache Shiro、MyBatis、Bootstrap UI），包括核心模块如：组织机构、角色用户、权限授权、数据权限、内容管理、工作流等

    内置功能

    • 用户管理：用户是系统操作者，该功能主要完成系统用户配置。
    • 机构管理：配置系统组织机构（公司、部门、小组），树结构展现，可随意调整上下级。
    • 区域管理：系统城市区域模型，如：国家、省市、地市、区县的维护。
    • 菜单管理：配置系统菜单，操作权限，按钮权限标识等。
    • 角色管理：角色菜单权限分配、设置角色按机构进行数据范围权限划分。
    • 字典管理：对系统中经常使用的一些较为固定的数据进行维护，如：是否、男女、类别、级别等。
    • 操作日志：系统正常操作日志记录和查询；系统异常信息日志记录和查询。
    • 连接池监视：监视当期系统数据库连接池状态，可进行分析SQL找出系统性能瓶颈。
    • 工作流引擎：实现业务工单流转、在线流程设计器。

    2013年就有的老平台了

  • webbase

    业务系统框架,包括员工管理,组织机构,请假出差申请,流程审批,信息汇总,excel导出等基础功能

  • JEECG

  • Eova快速开发平台

  • PSI 开源进销存系统

  • ECP 简单客户管理及进销存财务系统

  • ExamStack

    免费开源互联网考试、学习系统、创建在线教育网站的优质解决方案

  • mpsdk4j

    JAVA微信公平台开发SDK

  • jeewx

    微信公众账号开发平台

  • p3-weixin

    捷微H5活动开源平台, 采用插件模式开发H5营销活动，独立部署，解决微信活动大用户、高并发问题

  • jfinal-weixin

  • Ke361

    开源的淘宝客系统

  • JFinalShop

  • R3 Query

    商业智能报表

  • zftlive

    集成目前Android主流优秀第三方组件、优秀好用的自定义控件、实用工具类封装、以及一些APP共通模块

  • 《刀塔传奇》开源项目

  • KODExplorer 基于Web的在线文件管理、代码编辑器

  • Mybatis_PageHelper 分页插件支持任何复杂的单表、多表分页

  • 其他可选项 - WebX5/BeX5 看还有哪些?

项目管理

网站

在线工具

杂项

更多软件