분류 전체보기

[javascript] Rubyjs - A JavaScript standard library based on the Ruby core-lib 2013.07.02
Front-End 개발에 대한 자료 2013.07.02
[javascript] Flippant.js — A tiny library for flipping things over 2013.07.02
목표와 장애물은 묶음 상품이다. 2013.07.02
집중력 2013.07.02
쇠붙이에 부딪치지 않으면 불꽃을 일으키지 못하는 부싯돗처럼 열정이 없는 사람은 잠재력과 가능성에 불과하다. - 헨리 아미엘 - 2013.07.02

[javascript] Rubyjs - A JavaScript standard library based on the Ruby core-lib

홍반장水_ 2013. 7. 2. 10:33

2013. 7. 2. 10:33

A JavaScript standard library based on the Ruby core-lib

RubyJS is a JavaScript implementation of all methods from Ruby classes like Array, String, Numbers, Time and more.

http://rubyjs.org/

100% JavaScript

RubyJS is built on top of JavaScript. It runs in all browsers. No additional tools needed.

Works like Ruby

Easily port code from Ruby to JavaScript. Become productive in JavaScript in hours. Fully tested with rubyspec.

Fast and small

20 kilobytes minified and gzipped. It is as fast or faster than comparable libraries.

Utility belt or OO

Use RubyJS like a utility belt, transforming arrays, string and continue with native objects. Or use the fully-fledged RubyJS objects and make use of their mutator (aka bang) methods.

All-in-one Library

String, Array, Time, Numbers, Range, and more. RubyJS gives you the power of multiple 3rd party libraries, with one coherent API. So you only have to learn, manage and update one.

Ruby Features

Block arguments, destructive (bang-) methods, duck-typing, special variables, mixins.

Getting Started with RubyJS

: http://rubyjs.org/getting-started.html

저작자표시 (새창열림)

'프로그래밍 > Script' 카테고리의 다른 글

[jQuery] How To Remove Unnecessary Modules in jQuery (0)	2013.07.04
[javascript] Bacon.js - A small functional reactive programming lib for JavaScript. (0)	2013.07.02
Front-End 개발에 대한 자료 (0)	2013.07.02
[javascript] Flippant.js — A tiny library for flipping things over (0)	2013.07.02
[javascript] cujoJS — Build modular, maintainable web apps (0)	2013.07.01

Front-End 개발에 대한 자료

홍반장水_ 2013. 7. 2. 10:28

2013. 7. 2. 10:28

Front-End 개발에 대한 자료

A huge list of frontend development resources I collected over time. Pull requests are welcome. Website coming soon.

https://github.com/dypsilon/frontend-dev-bookmarks

Frontend Development

Guides
- Hack Design
- Designer School
- TheExpressiveWeb
- Talks To Help You Become A Better Front-End Engineer In 2013
- Web Development Teaching Materials
Architecture
- BEM: Methodology aimed at achieving fast to develop long-lived projects, team scalability, and code reuse.
- Atomic Design
- Polymer Project: Polymer is a new type of library for the web, built on top of Web Components, and designed to leverage the evolving web platform on modern browsers.
  - Video: Web Components: A Tectonic Shift for Web Development + Slides
  - Video: Web Components in Action
- Aura is an event-driven architecture for developing scalable applications using reusable widgets.
- Hydra is an easy-to-use framework that provides you with the necessary tools to create scalable applications using modules and widgets.
- Terrific.js provides you a Scalable Javascript Architecture, that helps you to modularize your jQuery/Zepto Code in a very intuitive and natural way
- Patterns For Large-Scale JavaScript Application Architecture
- Video: Nicholas Zakas: Scalable JavaScript Application Architecture
- Book: Learning JavaScript Design Patterns
- Book: Single page apps in depth
- Book: Scalable and Modular Architecture for CSS
- jQuery Application Architecture Chart
- How To Manage Large jQuery Apps
- Comparison between different Observer Pattern implementations
Workflow
- Video: Javascript Development Workflow of 2013 by Paul Irish + Slides
- Yeoman is a robust and opinionated set of tools, libraries, and a workflow that can help developers quickly build beautiful, compelling web apps.
- Grunt is a task-based command line build tool for JavaScript projects.
  - Web development is getting complex. Let's go shopping.
  - GruntStart: A Grunt-enabled head-start with the H5BP, jQuery, Modernizr, and Respond. The building blocks to quickly get started with Grunt to create an optimized website.
  - A beginner’s guide to Grunt
  - Grunt - Synchronised Testing Between Browsers/Devices
- Front-end Process - Flat Builds and Automation
- CSSCSS: A CSS redundancy analyzer that analyzes redundancy.
- Helium: JavaScript tool to scan your site and show unused CSS.
- ImageOptim-CLI: Make lossless optimisation of images part of your automated build process.
- jpegoptim: Utility to optimize/compress JPEG files.
- Pngcrush is an optimizer for PNG (Portable Network Graphics) files.
- Roots A light, super fast, and intuitive build system meant for rapid advanced front end development.
- Sparky.js is a client-side application scaffold which helps those who want to have organized structure in their app, but don't want to subscribe to a particular client-side MVC framework.
- Brunch is an assembler for HTML5 applications. It‘s agnostic to frameworks, libraries, programming, stylesheet & templating languages and backend technology.
- Mimosa is a batteries included web development workflow tool that will get you coding in seconds rather than hunting down plugins and wrangling config for hours.
- Automaton: Task automation tool built in JavaScript.
- Cartero: A modular client side asset manager.
- Mod is a task-based workflow tooling for web, it help developers quickly build robust and high-performance web applications.
Weekly & Daily Resources
- HTML5 Weekly
- HTML5 Bookmarks
- CSS Weekly
- JavaScript Weekly
- Sidebar.io The 5 best design links, everyday
- Web Design Weekly
- Responsive Design Newsletter
- echo.js: Reddit-like Website for JavaScript Resources
Programming & Markup Languages
- CSS
- JavaScript
  - Book: Eloquent JavaScript
  - JavaScript Study Guide
  - Javascript Closures
  - Combinator Recipes for Working With Objects in JavaScript
    - Part II
  - Prototypes and Inheritance in JavaScript
  - ECMA 262-3 in detail
  - JavaScript Garden
  - Google JavaScript Style Guide
  - Github JavaScript Styleguide
  - Wordpress JavaScript Coding Standards
  - Extensions
    - RubyJS is a JavaScript implementation of all methods from Ruby classes like Array, String, Numbers, Time and more.
    - Mout is a collection of modular JavaScript utilities that can be used in the browser as AMD modules or on node.js (without any overhead).
    - bacon.js: A small functional reactive programming lib for JavaScript.
  - Flow Control
- HTML
- Higher Level Languages
  - Dart: Typed language compiled to JavaScript. By Google.
  - Sass is an extension of CSS3, adding nested rules, variables, mixins, selector inheritance, and more. It’s translated to well-formatted, standard CSS using the command line tool or a web-framework plugin.
  - Less extends CSS with dynamic behavior such as variables, mixins, operations and functions.
  - Roole is a language that compiles to CSS.
  - Stylus: Expressive, dynamic, robust CSS
Frameworks
- JavaScript
  - Choosing a framework
  - Angular
    - Github
    - Learning
    - Integration
      - angular-requirejs-seed: this is a fork of Angular Seed but with changes needed for requireJS support.
      - Writing Reusable AngularJS Components with Bower
      - Native AngularJS directives for Twitter's Bootstrap.
      - Automating AngularJS With Yeoman, Grunt & Bower
      - Optimizing Angular Templates with Grunt on Heroku
      - Building Offline Applications With AngularJS and PouchDB
  - jQuery
    - Github
    - jQuery Wiki Page "Plugins/Authoring"
    - jQuery Plugin Development Boilerplate
    - The Ultimate Guide to Writing jQuery Plugins
    - Book: jQuery Fundamentals
    - Pragmatic jQuery Style
  - dojo
    - Github
    - Documentation
    - Writing Your Own Widget
    - 10 Reasons Why Your Projects Should Use the Dojo Toolkit by David Walsh
  - Backbone
    - Github
    - Book: Developing Backbone.js Applications
    - Unsuck your backbone
    - A Visual Guide to Marionette.js Views
    - Building a Backbone.js app tutorial series.
    - Migrating an existing app to Backbone
    - Chaplin.js: An architecture for JavaScript applications using the Backbone.js library.
  - Meteor: An open-source platform for building top-quality web apps in a fraction of the time.
    - Github
    - Best Learning Resources for Meteor.js
  - Zepto.js: A minimalist JavaScript library for modern browsers with a largely jQuery-compatible API.
    - Github
  - React by Facebook
    - Github
  - Qooxdoo is a universal JavaScript framework for building rich, interactive application, native-like apps for mobile devices, light-weight single-page oriented web applications or even applications to run outside the browser.
  - jQWidgets is jQuery based framework and set of widgets for building web-based applications that work on PC, Touch and Mobile devices
  - Flight is an event-driven web framework, from Twitter
  - Singool.js Lightweight JavaScript framework for developing single-page web applications
  - Knockout: Simplify dynamic JavaScript UIs by applying the Model-View-View Model (MVVM) pattern
  - Sammy.js is a tiny JavaScript framework developed to ease the pain and provide a basic structure for developing JavaScript applications.
  - Ember.js: A framework for creating ambitious web applications.
  - Maria: The MVC framework for JavaScript applications. The real MVC. The Smalltalk MVC. The Gang of Four MVC.
  - Terrific Composer is a Frontend Development Framework specifically designed for building deluxe frontends based on the Terrific concept
  - Rivets.js: Lightweight and powerful data binding + templating solution for building modern web applications.
  - Synapse: Data Binding For The Rest Of Us
  - A Comprehensive Collection Of Javascript Application Frameworks
  - JavaScript Data Binding Frameworks
- CSS
  - A collection of best frameworks
  - Twitter Bootstrap
    - Home Page
    - Github
    - Download
    - Bootstrap Hero List: The big badass list of bootstrap resources
    - Widgets
      - Color and Date Picker
      - WYSIHTML5 RTE for Bootstrap
      - Bootstrap Image Gallery
      - jQuery UI Bootstrap
      - Pines Notify: JavaScript notifications for Bootstrap or jQuery UI.
      - fuelUX: Fuel UX extends Twitter Bootstrap with additional lightweight JavaScript controls.
      - A date range picker for Twitter Bootstrap
      - Bootbox.js: alert, confirm and flexible dialogs for Twitter's Bootstrap framework
      - Time Picker
      - Date/Time Picker
      - ReCaptcha
      - Bootstrap Modal: Extends Bootstrap's native modals to provide additional functionality.
      - SelectBoxIt
      - File Upload
      - BootPag: BootPag - dynamic pagination jQuery plugin for twitter bootstrap
      - Bootstrap Arrows: A simple jQuery plugin and add-on to the popular Twitter Bootstrap framework to include the use of arrows at any angle in your UI designs.
      - X-editable: In-place editing with Twitter Bootstrap, jQuery UI or pure jQuery
      - Pagination
      - Slider
      - Application Wizard
    - Themes
      - Bootswatch: Theme catalog.
      - Jumpstart UI: Another catalog for paid themes
      - Darkstrap: A dark theme.
      - jQuery Mobile Boostrap: A jQuery Mobile theme based on Twitter Bootstrap
      - Wrapbootstrap
      - Flat UIFree Web User Interface Kit that Rocks!
      - Wordpress
        
        BootstrapWP
        
        Roots Theme
        
        Bootstrap
        
        Bootstrap for Wordpress
        
        Bootstrap for WP
        
        StrapPress
        
        WPBS
      - CSS3 Microsoft Modern Buttons
      - BootMetro: Metro style web framework
      - Cosmo: Windows 8 inspired theme
      - Inspiritas
      - Facebook
      - Google+
      - Flatstrap
      - Pinstrap
    - Misc
      - Boilerstrap: A blank slate for the modern web. Just add creativity.
      - Bootstrap GUI PSD: a toolkit designed to kickstart webdesign of webapps and sites.
      - Font Awesome: The iconic font designed for use with Twitter Bootstrap
      - Fontello: Icon fonts generator to get only the required fonts.
      - Typo3 Extension
      - Bootstrap CDN Free CDN for Twitter Bootstrap
      - Bootstrap Tour Quick and easy way to build your product tours with Twitter Bootstrap Popovers.
      - Bootsnipp: Design elements and code snippets for Bootstrap HTML/CSS/JS framework
      - Form Builder
      - PaintStrap: Generate beautiful Twitter Bootstrap themes using the Adobe kuler / COLOURlovers color scheme
      - TODC: A Google-styled theme for Twitter Bootstrap.
      - Layoutit!
  - Responsive Grid System
  - Responsive Grid System (2)
  - Golden Grid System
  - Compass: An open-source CSS Authoring Framework.
  - Pondasee: Front-end starter kit combined with the power of SCSS & Compass.
  - Centurion: A responsive web framework that scales with your device.
  - Foundation by Zurb: The most advanced responsive front-end framework in the world. +Foundation 3 Documentation + Foundation 4 Documentation + Stylus based port
  - Gumby
  - ProfoundGrid
  - Groundwork: GroundworkCSS's flexible grid system enables you to do rapid development and scales to fit any screen size, from handheld devices to large format televisions.
  - skelJS
  - Ink: Ink is a set of tools for quick development of web interfaces.
  - neat: A lightweight semantic grid framework for Sass and Bourbon.
  - Kube
  - rwdgrid
  - Simple Grid
  - One% CSS Grid
  - Workless
  - inuit.css - a powerful, scalable, Sass-based, BEM, OOCSS framework.
  - Kraken is a lightweight, mobile-first boilerplate for front-end web developers.
  - Axis - clean Stylus-based foundation to build your styles upon
  - Jeet next gen responsive grid
  - Susy - Responsive grids for Compass
Cross Browser
- Normalize.css
- HTML5 Cross Browser Polyfills
- Viewport Component
- Can I Use - Compatibility tables for support of HTML5, CSS3, SVG and more in desktop and mobile browsers.
- HTML5 Please - Collective recommendations for polyfills and implementation of HTML5 and CSS3 features.
Cross Device
- Responsive
  - Video: Responsive Design Workflow by Stephen Hay + Slides
  - Responsive Patterns
    - Responsive Navigation Patterns
    - Complex Navigation Patterns for Responsive Design
  - Responsinator
  - How to make a Responsive Newspaper-like layout
  - The State Of Responsive Web Design
  - Facing The Challenge: Building A Responsive Web Application
    - This repo contains techniques and concepts to build responsive & hybrid web applications.
  - Tables
  - Events
  - Images
    - Fluid Images
    - How to Use Responsive Images to Make Your Site Shine on Any Platform
    - Adaptive Images
    - Why We Need Responsive Images
    - Riloadr: A cross-browser framework-independent responsive images loader.
    - jQuery Picture
    - Picturefill
    - Clown Car Technique for Responsive Images
  - Text
    - FitText: A jQuery plugin for inflating web type
    - Out Of Words!: The responsive typography framework behind Words App
    - Responsive Font Sizing: Making your font size respond to your screen size, easy & maintainable.
    - Responsive Measure
- E-Mail
  - Responsive Email Design: A great guide to create Responsive Email Design
  - Responsive Email Templates: Some responsive templates for email
  - HTML Email Boilerplate
  - CSS Support in Email
- Mobile
  - Frameworks
    - jQuery Mobile: Touch-Optimized Web Framework for Smartphones & Tablets
    - jQTouch is a Zepto/jQuery plugin for mobile web development on the iPhone, Android, iPod Touch, and other forward-thinking devices.
    - Junior
  - Emulators
  - Scrolling
    - jSwipeKinetic is a jQuery plugin that enables you to add kinetic scrolling on your touch optimized projects. jSwipeKinetic is build on top of jGestures (jgestues.codeplex.com).
    - jQuery.pep.js: A lightweight plugin for kinetic-drag on mobile/desktop.
    - Overscroll is a jQuery plug-in that mimics the iphone/ipad scrolling experience in a browser.
    - Zynga Scroller
    - pull-to-refresh.js
    - Overthrow
    - Antiscroll
    - iscroll
  - Gestures
    - jGestures jQuery plugin enables you to add gesture events such as ‘pinch’, ‘rotate’, ‘swipe’, ‘tap’ and ‘orientationchange’ just like native jQuery events.
    - hammer.js is a focused, standalone JavaScript library, only for multi-touch gestures.
    - Touchy: is a highly configurable jQuery plugin. It exposes event data (velocity, etc.) for longpress, drag, pinch, rotate and swipe.
    - TouchSwipe
    - TipTap
    - jQuery.event.swipe
    - toe.js is a tiny library based on jQuery to enable sophisticated gestures on touch devices.
    - Jester
    - JS Touch Layer
    - Touch Events and Abstractions
  - DOM Objects Manipulation
    - jQuery.event.move
    - WKTouch: A JavaScript plugin for touch-capable devices, enabling multi-touch drag, scale and rotate on HTML elements.
  - Tap Acceleration
    - Energize
    - Tappable is a simple, standalone library to invoke the tap event for touch-friendly web browsers.
    - Fastclick is a simple, easy-to-use library for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers.
    - Lightning Touch
    - Creating Fast Buttons for Mobile Web Applications
  - Layout
    - Snap.js A Javascript Library for creating beautiful mobile shelfs in Javascript (Facebook and Path style side menus)
    - Flickable.js allows you to make any element touchable; useful for flicking between sections, or sliding elements around the page.
    - PageSlide is a jQuery plugin which slides a webpage over to reveal an additional interaction pane.
    - Swipe is a lightweight mobile slider with 1:1 touch movement, resistant bounds, scroll prevention, and completely library agnostic.
    - Swiper: Mobile touch slider with hardware accelerated transitions.
    - jQuery Mobile Pagination Plugin
    - SwipeSlide: A Zepto Plugin for iOS like swipe navigation.
    - stackable.js is an invaluable jQuery plugin that stacks your tables for small screens. It’s a huge advantage in terms of usability on mobile devices.
  - Reacting to Device Sensors
    - lenticular.js is a jQuery plugin for creating image animations that response to tilting or mouse events.
    - This End Up: Using Device Orientation
  - iOS
- Printers
  - Tips And Tricks For Print Style Sheets
Patterns & Snippets
- Responsive Patterns
- CSS3 Code Snippets
- The Blueprints are a collection of basic and minimal website concepts, components, plugins and layouts with minimal style for easy adaption and usage, or simply for inspiration.
DOM Manipulation
- xui: a super micro tiny dom library for authoring html5 mobile web applications.
- Tire offers a more lightweight alternative to libraries such as jQuery, Prototype and Zepto.
Typography
- Quick guide to webfonts via @font-face
- How To Achieve Cross-Browser @font-face Support
- Google Fonts
- Adobe Edge Web Fonts: Get started with free web fonts.
  - Edge Web Fonts Website
- Typekit: easy way to use commercial web font on your site.
- Matrix of fonts bundled with Mac and Windows operating systems, Microsoft Office and Adobe Creative Suite
- Typeset.css
- typecast
- CSSTypography
- SO: @font-face fonts only work on their own domain
- FitText: A jQuery plugin for inflating web type
- TypeButter
- slabText
- Baseline.js
- jKerny
- Lettering.js
- Trunk8 is an intelligent text truncation plugin to jQuery. It will cut off just enough text to prevent it from spilling over
- bacon is a jQuery plugin that allows you to wrap text around a bezier curve or a line.
- CSS Typography cheat sheet: Small roundup on CSS features that will enhance your web typography.
Services (Free & Commercial)
- TheToolbox
- colourco
- Color Scheme Designer: find resonate colors for a great design.
- HTML Entity Character Lookup
- SpritePad
- Responsinator
- HTML Shell
- Form Builder
- Zen BG
- Prepros
- CSS3 Media Query Builder
- jsFiddle
- codepen is an HTML, CSS, and JavaScript code editor right in your browser with instant previews of the code you see and write.
- site44 turns Dropbox folders to websites
- Backlift: Work in your Dropbox using your favorite editor. When you save your files, your website will automatically refresh.
- Smush.it uses optimization techniques specific to image format to remove unnecessary bytes from image files.
- JPEGmini Photo Server is an image optimization server which runs on Amazon EC2 (commercial).
- TinyPNG: Advanced lossy compression for PNG images that preserves full alpha transparency.
- Website Builders
  - Squarespace
  - BaseKit
  - Doomby
  - Edicy
  - IM Creator
  - Jimdo
  - Moonfruit
  - uCoz
  - Webnode
  - Webs
  - Weebly
  - Wix
  - Wordpress.com
  - Yola
  - 1&1 Homepage
Animation
- Stylie
- animate.less, is a bunch of cool, fun, and cross-browser animations converted into LESS for you to use in your Bootstrap projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
- Canvas Advanced Animation Toolkit is an scene graph director-based animation framework for javascript based in the concept of a timeline.
- tween.js: Super simple, fast and easy to use tweening engine which incorporates optimised Robert Penner's equations.
- Janis is a lightweight Javascript framework that provides simple animations via CSS transitions for modern browsers on the web as well as mobile devices.
- Rekapi: A keyframe animation library for JavaScript
- CanvasScript3 is a Javascript library for the new HTML5 Canvas with an interface similar to ActionScript3. This library enables Sprite Groups, Layers, Mouse Events, Keyboard Events, Bitmap Effects, Tween Animations etc.
- Shifty is a tweening engine built in JavaScript. It is designed to fit any number of tweening needs.
- emile.js is a no-frills stand-alone CSS animation JavaScript framework.
- Firmin: a JavaScript animation library using CSS transforms and transitions.
- $fx(): A compact, lightweight Javascript Library for animation.
- Keanu is a micro-lib for animation on Canvas/JS.
- jsAnim is a powerful, yet easy to use library for adding impressive animations to websites, without sacrificing standards or accessibility. Weighing in at just under 25 kilobytes, jsAnim packs a lot of punch for such a little application.
- GreenSock Animation Platform is a suite of tools for scripted animation.
  - Learning Resources
  - Examples
  - Codepen Repository: Codepen repository with examples of Greensock usage and code
- scripty2 is an open source JavaScript framework for advanced HTML-based user interfaces. Or simply put, scripty2 helps you build a more delicious web.
- Animator.js: JavaScript animation library.
- Processing.js: is the sister project of the popular Processing visual programming language, designed for the web. Processing.js makes your data visualizations, digital art, interactive animations, educational graphs, video games, etc. work using web standards and without any plug-ins.
- jQuery Transit: Super-smooth CSS3 transformations and transitions for jQuery.
- Move.js is a small JavaScript library making CSS3 backed animation extremely simple and elegant.
- Collie is a Javascript library that helps to create highly optimized animations and games using HTML 5.
- Year Of Moo: Angular.js Animations
- animate.css is a bunch of cool, fun, and cross-browser animations for you to use in your projects. Great for emphasis, home pages, sliders, and general just-add-water-awesomeness.
- Approach
- Magic is a CSS3 framework with many animations, it's simple to use and many animations are cross-browser compatible.
Widgets
- Kits
  - AlloyUI
  - Kendo UI
  - jQuery UI Bootstrap
  - Zebra: JavaScript library that follows easy OOP concept, provides HTML5 Canvas based Rich UI and includes Java to JavaScript converter tool
- File Upload
- Sitemap
  - SlickMap CSS
- Table Of Contents
- Modals
- Notifications
  - Pines Notify
  - notifier.js
  - noty
  - Toastr
  - alertify.js
  - Apprise
- Gallery Sliders
- Pagination
  - jPages
- Selects
  - jQuery Recurrence Input
  - Select2
  - jquery.selectable.js
  - chosen is a library for making long, unwieldy select boxes more friendly.
- Progress Bars
  - Percentage Loader
  - progress.js
- Trees
  - Nestable
- Navigation
  - jPanelMenu
- Tooltips
  - opentip
- Misc
  - jQuery Knob
  - DopelessRotate
  - jQuery Addresspicker
  - Fangle: create interactive documents from plain text.
Visualization
- Photon
- CSS3 shapes
- Morris.js
- Cube
- Cubism.js
- D3.js
  - Introduction to D3
  - Interactive D3 Tutorial
  - NVD3
- Crossfilter
- Datavisualization.ch
- jQuery.Gantt
- easy pie chart
- Gauge.js
- Google Chart Tools
- Piecon
- Viskit.js
- jStat
- CHAP Links Library
- bonsai
- Smoothie Charts
- DataMaps
- mxgraph
- Paper.js is an open source vector graphics scripting framework that runs on top of the HTML5 Canvas.
- Timeline.js: A Storytelling Timeline built in JavaScript.
- xCharts is a JS library for creating attractive, custom data-driven chart visualizations. It uses HTML, CSS, and SVG to create dynamic, fluid charts that can be easily customized and integrated.
- jQuery Gantt editor
- amCharts is a robust charting tool that will suit any dataviz need.
- Responsive vertical timeline
- Raphael.js Easy vector graphics for the web.
- three.js Javascript 3D library.
- Highcharts: Interactive JavaScript Charts for your web projects.
- Flot: Attractive JavaScript plotting for jQuery
Validation & Forms
- Mention.js Lightweight wrapper for adding @user mention functionality to Twitter Bootstraps Typeahead plugin
- ALAJAX
- Parsley.js: Validate your forms, frontend, without writing a single line of javascript!
- mailcheck.js: A jQuery plugin that suggests a right domain when your users misspell it in an email address.
- one-validation is a collection of regular expressions for general validation purposes.
- nextVal is an easy-to-use, flexible and robust form validation plugin for jQuery.
- Fields.js creates collections of fields. Each field is constantly evaluated for validity, and is accessible through the collection.
- IV.js was created to provide a intutive way to provide validation filters that are useful in processing user input.
- Ladda: A UI concept which merges loading indicators into the action that invoked them.
- jQuery Super Labels
Transitions
- Quicksand
- Isotope
- flippant.js
- Meaningful Transitions
Numbers
- numeral.js: A javascript library for formatting and manipulating numbers.
- accounting.js
- numbers.js
Time and Dates
- moment.js: A 5.5kb javascript date library for parsing, validating, manipulating, and formatting dates.
- XDate
- Pikaday
Search
- Fullproof
- lunr.js is a simple full text search engine for your client side applications.
Testing
- FiveUI Extensible/open browser extension & headless system for testing UI Consistency guidelines (or anything else you can test with injected JS).
- Writing Testable JavaScript
- Writing Testable Frontend Javascript Part 1 – Anti-patterns and their fixes
- Introduction to BDD
- cucumber
  - cucumber.js
  - Gherkin is the language that Cucumber understands.
    - Feature Introduction
    - Given when then
- Jasmine - JavaScript BDD testing framework with Rspec-like syntax
Template Engines
- ICanHaz.js
- Hogan.js
- Handlebars.js: Minimal Templating on Steroids
- Mustache: Logic-less templates
- Transparency
- doT.js
- Walrus
- Chibi
- Templayed.js
- ECT: Fastest JavaScript template engine with CoffeeScript syntax
- pithy: An internal DSL for generating HTML in JavaScript
- T: T.js is a template engine that uses simple Javascript data structure to represent html/xml data.
- Nunjucks is a full featured templating engine for javascript.
- Jade
- Linked.in Dust.js
Routing And URLs
- Crossroads.js
- Hash.js
- director
- Davis.js
- path.js
- URI.js
- Roadcrew.js
- jQuery Address
- page.js
- speakingurl: generate a so called "static", "Clean URL", "Pretty URL" or "slug" from a string.
Rich Text Editors
- WYSIHTML5
- MarkItUp
- Hallo
- Substance Composer
- Proper
- SnapEditor
- Create.js
- MDMagick
- X-editable
Code Viewers & Editors
- SublimeText
- Rainbow.js
- Intelligist
- Prism.js
- Brackets: An open source code editor for the web, written in JavaScript, HTML and CSS by Adobe.
- CodeMirror
- Scripted
- tabIndent.js
- Behave.js is a lightweight library for adding IDE style behaviors to plain text areas, making it much more enjoyable to write code in.
Refactoring
- Refactoring Javascript with kratko.js
Performance
- General Information
  - Video: DOM, HTML5, & CSS3 Performance by Paul Irish
  - Video: High Performance Javascript by Nicholas Zakas
  - Video: Building A Performant HTML5 App with Trunal Bhanse and Akhilesh Gupta (LinkedIn)
  - Writing Fast, Memory-Efficient JavaScript
  - JavaScript Performance Best Practices by Nokia
  - Improving the performance of your HTML5 App
  - Best Practices for a Faster Web App with HTML5
  - Front-end performance for web designers and front-end developers
- Memory
- Tools
  - jsPerf, the JavaScript performance playground
  - Chrome Developer Tools
  - V8
    - Optimizing for V8 - very technical series on the V8 engine
    - I-want-to-optimize-my-JS-application-on-V8 checklist
    - Performance tips for JavaScript in V8
  - JavaScript Leak Finder
    - Introduction Article
  - Navigation Timing
  - Firebug Paint Events
  - Locache: JavaScript caching framework for client side caching in the browser using localStorage
- DOM Manipulation
- Animation
- Hardware Acceleration
  - Visualizing WebKit’s hardware acceleration
  - List of Chromium Command Line Switches
- Browser Internals
- Images
- HTTP Transport
  - Fantastic front-end performance: Concatenate, Compress & Cache
  - Video: Cache Is King! by Steve Souders
  - Best Practices for Speeding Up Your Web Site by Yahoo
Modularity & Loaders
- Lazy Module Declaration: JavaScript Module-Assembler for building better web applications
- UMD (Universal Module Definition) patterns
- Browserify
- require.js
  - Plugins
- sea.js A Module Loader for the Web
- CrapLoader
- Writing Modular JavaScript With AMD, CommonJS & ES Harmony
- Путь JavaScript модуля
- Modular JavaScript with RequireJS
- LABjs & RequireJS: Loading JavaScript Resources the Fun Way
- JavaScript Inheritance and Public/Private members
- Deep dive into the murky waters of script loading
- Terminology: Modules
Package Management
- bower
- volo
- parcel is easy package management using a file server and path conventions, with built in support for Amazon S3. It is designed to encode package metadata, including name, version and OS within a path. The conventions allow this metadata to be queried, without the need for a database.
- jam.js
- component
Image Manipulation
- Paintbrush.js
- Obscura
- jCrop
- Pixastic
HTTP
- Specification
- Using CORS
- Cross-domain Ajax with Cross-Origin Resource Sharing
WebSocket
- Specification
- socket.io aims to make realtime apps possible in every browser and mobile device, blurring the differences between the different transport mechanisms.
- engine.io is the implementation of transport-based cross-browser/cross-device bi-directional communication layer for Socket.IO.
- SockJS is a browser JavaScript library that provides a WebSocket-like object. SockJS gives you a coherent, cross-browser, Javascript API which creates a low latency, full duplex, cross-domain communication channel between the browser and the web server.
Error Handling & Debugging
- Tracing.js - Javascript function tracing.
- JavaScript error handling anti-pattern
- Tattletale
Documentation
- dexy is a free-form literate documentation tool for writing any kind of technical document incorporating code.
- docco is a quick-and-dirty, hundred-line-long, literate-programming-style documentation generator.
- styledocco generates documentation and style guide documents from your stylesheets.
- Ronn builds manuals. It converts simple, human readable textfiles to roff for terminal display, and also to HTML for the web.
- dox is a JavaScript documentation generator written with node. Dox no longer generates an opinionated structure or style for your docs, it simply gives you a JSON representation, allowing you to use markdown and JSDoc-style tags.
- YUIDoc is a Node.js application that generates API documentation from comments in source, using a syntax similar to tools like Javadoc and Doxygen.
- coddoc is a jsdoc parsing library. Coddoc is different in that it is easily extensible by allowing users to add tag and code parsers through the use of coddoc.addTagHandler and coddoc.addCodeHandler. coddoc also parses source code to be used in APIs.
- sphinx a tool that makes it easy to create intelligent and beautiful documentation
- Using JSDoc
Windows 8 Style
- Metro UI CSS
- BootMetro
- metro-bootstrap
- Metro UI Template
- Droptiles – Metro-Style Web Dashboard
- Metro JS
- Windows Metro tiles with Javascript and CSS3
- Cosmo
- Video: What Web Developers Need to Know When Building Metro style Apps
- CSS3 Microsoft Modern Buttons
- Visual Studio 2012 Image Library - 5,000+ Images Downloadable Now
- Metro User Interface Implementation and Resources
- Windows-8-like animations with CSS3 and jQuery: a demo made by Sara Soueidan about creating a Modern UI design like in Windows 8.
Video & Audio
- SublimeVideo: Modular Video Player Framework.
- Video.js: The open source HTML5 video player.
- FlowPlayer: The video player for the web.
- longtailVideo: dual-mode HTML5 & Flash player.
- howler.js
- Stratus 2 soundcloud player
- jPlayer is the completely free and open source (MIT) media library written in JavaScript.
- MediaElement.js: HTML5 audio and video players in pure HTML and CSS.
- audio.js is a drop-in javascript library that allows HTML5’s "audio" tag to be used anywhere.
Library Collections
- Unheap: A tidy repository of jQuery plugins
- jster
- MicroJS helps you discover the most compact-but-powerful microframeworks.
- JSPkg: reference library and package manager
- jquer.in is a curated collection of jQuery plugins.
Other Front End Collections
- pineapple.io: A central hub of Tutorials, Tools and Assets for developers and designers
- setapp Front End: Discover apps, tools, news and tips
- Frontdesk: Community driven list of useful things for Front End Developers
- Front-end Code Standards & Best Practices by Roundarch Isobar
Chat
- XMPP using JSON
- Converse.js is an open source, webchat client, that runs in the browser and can be integrated into any website.
Prototyping
- Video: Style guides are the new Photoshop by Stephen Hay + Slides
- fixie
- Holder.js
JSON
- JSON Query Language is a query and processing language specifically designed for the popular JSON data model.
- Oboe.js makes it really easy to start using json from a response before the ajax request completes; or even if it never completes.
Presentations
- Ancesor.js
- Slideshow.html
- HTML5 Slideshow
- jQuery Screen
- reveal.js
- html5 Slides by Google
- Slides
- CSSS
- deck.js
- controldeck.js
- impress.js
Scrolling
- AppScroll.js AppScroll is a tiny (< 100 lines) JS library that fixes the "website dragging" issue caused on iDevices
- Scrollpath
- jQuery NiceScroll
- FoldScroll
- Scrollorama
Keyboard
- Mousetrap
- Keypress
- konami.js
- Keys.js
Tables & DataGrids
- Tablecloth.js
- Responsive Data Tables
- stacktable.js
- FooTable
- Handsontable
- Backgrid.js
- Gridster
- Flex
Security
- oAuth Consumer Library by John Kristian
  - ohauth
  - How iD Logs in to OpenStreetMap
- JSO - a Javascript OAuth Library
- xdoauthproxy
- JavaScript Cryptography
- Javascript Crypto Library
- Stanford Javascript Crypto Library
- mozilla / jwcrypto
- Critic
  - Javascript Cryptography Considered Harmful
  - Final post on Javascript crypto
Layout
- Shapeshift is a plugin which will dynamically arrange a collection of elements into a column grid system similar to Pinterest.
- CollagePlus: This plugin for jQuery will arrange your images to fit exactly within a container.
Jobs & Hiring
- GitHub Jobs
- Authentic Jobs
- 37signals Job Board
- Smashing Jobs
- Front-end Developer Interview Questions
- Interview This!: A list of questions to ask employers.
Misc
- zip.js
- simpleCart.js
- Aware.js is a simple jQuery plugin that allows a site to customize and personalize the display of content based on a reader's behavior without requiring login, authentication, or any server-side processing.
- How to directly upload files to Amazon S3 from your client side web app
- jIO is a client-side JavaScript library to manage documents across multiple storages.

저작자표시 (새창열림)

'프로그래밍 > Script' 카테고리의 다른 글

[javascript] Bacon.js - A small functional reactive programming lib for JavaScript. (0)	2013.07.02
[javascript] Rubyjs - A JavaScript standard library based on the Ruby core-lib (0)	2013.07.02
[javascript] Flippant.js — A tiny library for flipping things over (0)	2013.07.02
[javascript] cujoJS — Build modular, maintainable web apps (0)	2013.07.01
[javascript] Javascript library 추가하기 - APTANA (0)	2013.06.28

[javascript] Flippant.js — A tiny library for flipping things over

홍반장水_ 2013. 7. 2. 09:31

2013. 7. 2. 09:31

Flippant.js — A tiny library for flipping things over

Flippant.js is a mini JavaScript and CSS library that lets you flip things over. It has zero dependencies, is easily customized, and exports a single function: flip.

Homepage: http://mintchaos.github.io/flippant.js/
GitHub: https://github.com/mintchaos/flippant.js

http://labs.mintchaos.com/flippant.js/

저작자표시 (새창열림)

'프로그래밍 > Script' 카테고리의 다른 글

[javascript] Rubyjs - A JavaScript standard library based on the Ruby core-lib (0)	2013.07.02
Front-End 개발에 대한 자료 (0)	2013.07.02
[javascript] cujoJS — Build modular, maintainable web apps (0)	2013.07.01
[javascript] Javascript library 추가하기 - APTANA (0)	2013.06.28
[javascript] Jindo (0)	2013.06.28

목표와 장애물은 묶음 상품이다.

홍반장水_ 2013. 7. 2. 09:24

2013. 7. 2. 09:24

하고 싶은 것을 생각하는 순간
장애물도 같이 따라온다.
목표와 장애물은
묶음 상품이다.
-전옥표, ‘빅 픽쳐를 그려라’에서

목표가 클수록 뛰어넘어야 할
장애의 벽도 커지게 되어 있습니다.
기회는 전혀 기회처럼 보이지 않고
불행이나 실패나
거부의 몸짓으로 변장해서 나타난다는 말이 있습니다.
지금 당장의 고통이나 비극은
어떤 좋은 것을 얻을 수 있는
기회라고 바꿔 생각해보면 어떨까요?

저작자표시 (새창열림)

'생활의 발견 > 행복한 경영' 카테고리의 다른 글

의지가 굳은 사람에겐 방법이 따라온다. (0)	2013.07.04
끝없이 배워도 부족하다. (0)	2013.07.03
우리는 받는 것이 아닌, 주는 것에서 기쁨을 느낀다. (0)	2013.07.01
사람들은 리더가 기대하는 만큼만 성과를 낸다. (0)	2013.06.28
자신의 운은 자신이 만든다. (0)	2013.06.27

집중력

홍반장水_ 2013. 7. 2. 09:23

2013. 7. 2. 09:23

위대한 업적을 남긴 사람들의
삶에는 한 가지 공통점이 있답니다.
바로 고집스러울 만큼 강한 집중력을 가졌다는 거예요.
마치 레이저 불빛처럼 한 가지 목표를 향해 달려갑니다.
그들은 목표를 이루기 전까지 단 한 치의
곁눈도 팔지 않습니다.

- 켄 블랜차드 외의《춤추는 고래의 실천》중에서 -

* 집중력은 정신력과도 통합니다.
자신이 세운 선한 목표를 끝까지 이어가는 힘,
자신의 모든 시간과 삶을 통째로 걸고 곁눈 팔지 않는 힘,
그래서 때로는 경외감마저 불러 일으키는 것,
그것이 바로 무서운 정신력이고
집중력입니다.

저작자표시 (새창열림)

'아침편지' 카테고리의 다른 글

엄마의 주름 (0)	2013.07.04
젊어지는 식사 (0)	2013.07.03
"여기 있다. 봐라." (0)	2013.07.01
삐뚤삐뚤 날아도... (0)	2013.06.29
아는 만큼 보인다? (0)	2013.06.28

쇠붙이에 부딪치지 않으면 불꽃을 일으키지 못하는 부싯돗처럼 열정이 없는 사람은 잠재력과 가능성에 불과하다. - 헨리 아미엘 -

홍반장水_ 2013. 7. 2. 09:07

2013. 7. 2. 09:07

쇠붙이에 부딪치지 않으면 불꽃을 일으키지 못하는 부싯돗처럼 열정이 없는 사람은 잠재력과 가능성에 불과하다. - 헨리 아미엘 -

저작자표시 (새창열림)

'생활의 발견 > Cool' 카테고리의 다른 글

누군가에게 저항이 가장 적은 길을 제시해준다고 그 사람의 앞길이 편해지는 것은 아니다. 때때로 사람을 돕는 최고의 방법은 책임을 묻고 어떤 변명도 용납하지 않는 것이다. - 윌리엄 베넷, .. (0)	2013.07.05
가야 할 방향으로 먼저 가봐야 한다. 그래야만 사람들에게 방향을 제시할 수 있다. - 석가모니 - (0)	2013.07.03
일시적인 충동이 아니라 연속적인 작은 성과가 위대한 업적을 이룬다. - 빈센트 반 고흐 - (0)	2013.07.01
가장 뛰어난 두뇌의 소유자보다는 동료의 두뇌와 재능을 조화롭게 이용하는 사람이 가장 만족스러운 결과를 얻는다. (0)	2013.06.27
재능이라고 불리는 것은 올바르게 계속된 지독한 노동 이외에 아무것도 아니다 - 어니스트 헤밍웨이 - (0)	2013.06.20

PREV 이전 1 ···1930 1931 1932 1933 1934 1935 1936 ···2195 NEXT 다음

긍정적 사고, 음식의 절제, 규칙적인 운동

분류 전체보기

[javascript] Rubyjs - A JavaScript standard library based on the Ruby core-lib

A JavaScript standard library based on the Ruby core-lib

100% JavaScript

Works like Ruby

Fast and small

Utility belt or OO

All-in-one Library

Ruby Features

Getting Started with RubyJS

'프로그래밍 > Script' 카테고리의 다른 글

Front-End 개발에 대한 자료

Frontend Development

'프로그래밍 > Script' 카테고리의 다른 글

[javascript] Flippant.js — A tiny library for flipping things over

Flippant.js — A tiny library for flipping things over

'프로그래밍 > Script' 카테고리의 다른 글

목표와 장애물은 묶음 상품이다.

'생활의 발견 > 행복한 경영' 카테고리의 다른 글

집중력

'아침편지' 카테고리의 다른 글

쇠붙이에 부딪치지 않으면 불꽃을 일으키지 못하는 부싯돗처럼 열정이 없는 사람은 잠재력과 가능성에 불과하다. - 헨리 아미엘 -

'생활의 발견 > Cool' 카테고리의 다른 글

+ Recent posts

티스토리툴바