electronical Brain

Unterschiede

Hier werden die Unterschiede zwischen zwei Versionen angezeigt.

Link zu dieser Vergleichsansicht

Beide Seiten der vorigen RevisionVorhergehende Überarbeitung
Nächste Überarbeitung		Vorhergehende Überarbeitung
Letzte ÜberarbeitungBeide Seiten der Revision
pub:web-development-toolbox [2013/07/15 14:05] – Marco Kragepub:web-development-toolbox [2014/05/12 08:59] – Marco Krage
Zeile 1: Zeile 1:
 ====== Web Development Toolbox ====== ====== Web Development Toolbox ======
-Rule the InterWebz+Rule the InterWebz - Collection of usefull libraries and code snippets for HTML, CSS an Javascript. I love Javascript.
  
 ===== Javascript ===== ===== Javascript =====
 [[http://docs.jquery.com/Downloading_jQuery|jQuery Download]] - [[http://developers.google.com/speed/libraries/devguide?hl=de#jquery|Google CDN]] [[http://docs.jquery.com/Downloading_jQuery|jQuery Download]] - [[http://developers.google.com/speed/libraries/devguide?hl=de#jquery|Google CDN]]
  
-http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js+https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js 
 +https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js
  
-<code html><script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script></code> +<code html><script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script></code>
- +
-===== Librarys ===== +
-markdown  https://github.com/chjj/marked +
-lightbox  https://github.com/dimsemenov/Magnific-Popup +
-templates https://github.com/blueimp/JavaScript-Templates; https://github.com/archan937/templayed.js +
-password  https://github.com/antelle/passfield +
-formvalid https://github.com/guillaumepotier/Parsley.js +
-grid      https://github.com/suprb/Grid-A-Licious +
-datepicker  https://github.com/dbushell/Pikaday +
-extract values  https://github.com/laktek/extract-values +
-number format   https://github.com/adamwdraper/Numeral-js +
-Instrumente  https://github.com/toorshia/justgage +
-PieChartsFavicon  https://github.com/lipka/piecon +
-keyboardShortcuts   https://github.com/ccampbell/mousetrap +
-QRcode  https://github.com/lrsjng/jQuery.qrcode +
-multitouch  https://github.com/EightMedia/hammer.js +
-TOC   https://github.com/jgallen23/toc +
-fullscreen  https://github.com/sindresorhus/screenfull.js+
  
 +==== Librarys ====
 +^ Funktion ^ Link ^
 +| Paramter/Arguments | https://github.com/stretchr/arg.js |
 +| Markdown | https://github.com/chjj/marked |
 +| Cookie | https://github.com/carhartl/jquery-cookie |
 +| Lightbox | https://github.com/dimsemenov/Magnific-Popup |
 +| Templates | https://github.com/blueimp/JavaScript-Templates |
 +| Templates | https://github.com/archan937/templayed.js |
 +| Password Fields | https://github.com/antelle/passfield |
 +| Form validation | https://github.com/guillaumepotier/Parsley.js |
 +| Grid | https://github.com/suprb/Grid-A-Licious |
 +| Datepicker | https://github.com/dbushell/Pikaday |
 +| Extract Values | https://github.com/laktek/extract-values |
 +| Number Format | https://github.com/adamwdraper/Numeral-js |
 +| Instrumente Canvas | https://github.com/toorshia/justgage |
 +| Pie Chart Favicon | https://github.com/lipka/piecon |
 +| Keyboard Shortcuts | https://github.com/ccampbell/mousetrap |
 +| QRcode | https://github.com/lrsjng/jQuery.qrcode |
 +| Multitouch | https://github.com/EightMedia/hammer.js |
 +| TOC Inhalt | https://github.com/jgallen23/toc |
 +| Fullscreen | https://github.com/sindresorhus/screenfull.js |
 +| Tabs | https://github.com/aarondo/tabulous.js |
 +| Progress Bar | https://github.com/usablica/progress.js; https://github.com/rstacruz/nprogress |
 +| Google Map | https://github.com/danielemoraschi/maplace.js |
 +| Input Max Length | https://github.com/pioul/jQuery.Maxlength |
 +| Datum | https://github.com/MatthewMueller/date |
 +| jQuery alternative | https://github.com/timjansen/minified.js |
 +| URL | https://github.com/websanova/js-url |
 +| Panorama | https://github.com/peachananr/panorama_viewer |
 +| Syntax Highlight | https://github.com/isagalaev/highlight.js; https://github.com/mozilla/sweet.js |
 +| prefix-free | https://github.com/LeaVerou/prefixfree |
 +| Mansory | https://github.com/kombai/freewall |
 +| AlphaID (like Youtube) | http://www.hashids.org/ |
 +|  |  |
 +==== School ====
 +=== Namespacing ===
 +http://stackoverflow.com/a/2421949 -- http://jsfiddle.net/sinky/P9L9W/ -- http://jsfiddle.net/xub6u/
  
-==== Namespacing ==== 
-http://stackoverflow.com/a/2421949 
-<code javascript>(function() {  
- var user = 'foo', 
-     variables = 'bar' 
-     savely;  
-  function private() { 
-   return true; 
-  }     
-})(); </code> 
  
 ===== HTML ===== ===== HTML =====
Zeile 49: Zeile 59:
  
 ===== CSS ===== ===== CSS =====
- 
 ==== Librarys ==== ==== Librarys ====
  
-Grid    https://github.com/grahammiller/ResponsiveGridSystem +^ Funktion ^ Link ^ 
-noramlize https://github.com/necolas/normalize.css +| Grid | https://github.com/grahammiller/ResponsiveGridSystem | 
-buttons https://github.com/necolas/css3-github-buttons+| Normalize | https://github.com/necolas/normalize.css | 
 +| Buttons | https://github.com/necolas/css3-github-buttons | 
 +| Colors | https://github.com/mrmrs/colors |
  
- +==== Webkit font rendering ====
- +
-[[http://necolas.github.com/normalize.css/]] +
-Siehe auch [[pub:normalize_css_additional_style]] +
- +
-Webkit font rendering+
 <code css>html { <code css>html {
   -webkit-font-smoothing: antialiased;   -webkit-font-smoothing: antialiased;
 }</code> }</code>
  
-Nicer Headlines [[http://aestheticallyloyal.com/public/optimize-legibility/]]+==== Nicer Headlines ==== 
 +http://aestheticallyloyal.com/public/optimize-legibility/
 <code css>h1, h2 { <code css>h1, h2 {
   text-rendering: optimizeLegibility;   text-rendering: optimizeLegibility;
 }</code> }</code>
-CSS Link Fade Animation+ 
 +==== CSS Animation ====
 <code css> <code css>
 a { a {
Zeile 79: Zeile 87:
 }</code> }</code>
  
-The new Box Model+==== The new Box Model ====
 http://paulirish.com/2012/box-sizing-border-box-ftw/ http://paulirish.com/2012/box-sizing-border-box-ftw/
 <code css>* {  <code css>* { 
Zeile 87: Zeile 95:
 </code> </code>
  
 +==== Media Queries ====
 <code css>/*-----------------------------------------------------------------------------------*/ <code css>/*-----------------------------------------------------------------------------------*/
 /* CSS3 Media Queries for Responsiveness (mobile-first, from small to big) /* CSS3 Media Queries for Responsiveness (mobile-first, from small to big)
Zeile 102: Zeile 111:
 @media screen and (min-width: 1192px) { @media screen and (min-width: 1192px) {
 }</code> }</code>
 +
 +===== Webserver =====
 +
 +==== Moongoose ====
 +All platform, portable, slim, simple.
 +I have put together my own package with php. 
 +
 +Windows Build with PHP: https://github.com/sinky/mongoose-win-php
 +Source: https://github.com/valenok/mongoose
 +Builds: https://code.google.com/p/mongoose/
 +
pub/web-development-toolbox.txt · Zuletzt geändert: 2014/05/12 09:01 von Marco Krage