แนะนำ responsive light box plugin ขนาดเล็ก ใช้งานง่าย ขนาดเพียง 2kB เราแค่ระบุ data-lity เข้าไปใน html tag ก็ใช้ได้แล้วครับ
ตัวอย่างการใช้งาน
|
1 |
<a href="#inline" data-lity>Inline</a> |
ดูรายละเอียดการใช้งานเต็มๆได้ที่นี่
http://sorgalla.com/lity/
1. Pickadate.js
http://amsul.ca/pickadate.js
2. Bootstrap Datepicker
https://github.com/eternicode/bootstrap-datepicker
3. jQuery UI datepicker
https://jqueryui.com/datepicker/
4. Zebra_Datepicker
http://stefangabos.ro/jquery/zebra-datepicker/
5. Eyecon.ro datepicker
http://www.eyecon.ro/datepicker/
ถ้าให้เลือกตัวที่ชอบที่สุดน่าจะเป็น Pickdate.js (mobile-friendly,responsive) กับคู่มือที่ละเอียดดีจริงๆ
จริงๆ แล้วการเพิ่มความเร็วให้หน้าเว็บเพจมีหลายวิธี โพสต์นี้จะเน้นไปที่ CSS นะครับ และเพิ่มเรื่องการจัดการรูปภาพให้ด้วยครับ
…………………………………………………….
…………………………………………………….
1. เขียนโค้ดแบบ Shorthand แน่นอนเมื่อโค้ดสั้นลง การประมวลผลย่อมน้อยลง ส่งผลให้หน้าเว็บโหลดเร็วขึ้น
2. หลีกเลี่ยงการทำ CSS Hacks ให้กับแต่ละบราวเซอร์ เพราะมันเพิ่มขนาดให้กับไฟล์และซับซ้อน
3. ลดขนาดไฟล์ของ CSS ลง เพื่อเพิ่มความเร็วในการโหลด
4. ควรเขียน CSS ใน tag <head>
5. พยายามใช้ external CSS เพียง 1 ไฟล์
6. อย่าใช้การเรียกแบบ @import
7. เอา CSS ที่ไม่ใช้ออกให้หมด อย่าปล่อยทิ้งไว้
8. อย่าเขียน CSS ให้ tag HTML เช่น h1 และ DIV
9. ถ้าเป็นเพียงคำสั่ง CSS เล็กๆ ก็ให้เขียนแบบ inline ได้
………………………………………………………………………………..
………………………………………………………………………………..
1. นามสกุลรูปภาพ ใช้ JPGs เมื่อภาพมีคุณภาพ ความละเอียดสูง
ใช้ PNG กับรูปภาพที่เป็นไอคอน,โลโก้,ข้อความ,สัญลักษณ์ต่างๆ
ใช้ GIFs สำหรับภาพเล็กๆ ไม่มีรายละเอียดมาก และแน่นอนควรหลีกเลี่ยง BMPs หรือ TIFFs.
2. ขนาดภาพควรเหมาะสม ควรบันทึกรูปภาพให้พอดีกับความกว้างของ Template สร้างรูปภาพในแบบ Responsive โดยกำหนดความกว้างคงที่แต่ความสูงให้กำหนดเป็นแบบ auto
3. การบีบอัดรูปภาพ สำหรับนามสกุล JPGs ให้ใช้การบีบอัดที่ 60-70% และสำหรับหน้าจอแบบ Retina ให้เพิ่มขึ้นเป็น 150-200%
4. แน่นอนควรใช้รูปภาพให้น้อยที่สุดเท่าที่จะเป็นไปได้
เป็น JavaScript Database (NoSQL) ที่ช่วยให้ web app หรือ mobile app ของเราเก็บข้อมูลแบบ offline ได้ และสามารถ sync กับ server ได้ทันทีที่ online!
เหมาะมากสำหรับ app ใดๆก็ตามที่อยากเก็บข้อมูล local ไว้ตลอดเวลา และซิงค์กับ server ทันทีเมื่อออนไลน์ครับ ประยุกต์ใช้ได้เยอะมาก จะทำเป็นโปรแกรม chat ก็ได้ หรือจะทำเป็น app แบบ realtime ก็ยังไหว
ลองใช้ดูครับ มีตัวอย่างเป็น todo app ให้ลองเล่นด้วย
อ้อที่ว่า sync กับ Server หมายถึง เราต้องติดตั้ง CouchDB (คนละตัวกับ PouchDB นะ) ที่ server เราด้วยครับ หรือใครไม่มี server ก็แนะนำให้ใช้ cloudant.com เป็น CouchDB แบบ Cloud ครับ
เว็บหลัก:
https://pouchdb.com
เริ่มได้ที่นี่มี youtube สอน:
https://pouchdb.com/getting-started.html
1. Role-based Permissions for Laravel 5 (RBAC)
https://goo.gl/bMN7kU
2. Scaffold generator for Laravel 5 with bootstrap 3 (Gen CRUD)
https://goo.gl/KpxMNC
3. A package to backup your Laravel 5 app (Backup site and DB)
https://goo.gl/NNPKxX
4. An eloquent way of importing and exporting Excel and CSV files
https://goo.gl/dLCKuh
5. Get started with Laravel 5.2 and Angular (material)
https://goo.gl/PNKmbW
6. Simple laravel5 example for tutorial
https://goo.gl/MhA5Ru
7. jQuery DataTables API for Laravel 5
https://goo.gl/J44a0z
8. Lavalite – CMS built on Laravel 5.2
https://goo.gl/9wxP3G
9. A library to help you work with dates in multiple languages, based on Carbon.
https://goo.gl/5LGZsz
10. No CAPTCHA reCAPTCHA For Laravel.
https://goo.gl/vFiPsS
11. A MongoDB based Eloquent model and Query builder for Laravel
https://goo.gl/TUIZ1C
ฟรี! คลิปวิดีโอ “การติดตั้ง Ionic Framework 2 สำหรับสร้าง Mobile App” ครับ
ฟรี! คลิปวิดีโอพิเศษ สำหรับคนที่อยากเริ่มเขียน Android ครับ พาติดตั้ง Android Studio, Genymotion emulator จนถึง Hello World เลย
• npm init
เริ่มต้นใช้งาน และช่วยให้เราสร้าง และใส่รายละเอียดเกี่ยวกับโปรเจคของเรา (package.json)
• npm install module_name
ติดตั้ง module
• npm install -g module_name
ติดตั้ง module ในระดับ global
• npm install module_name –save
ติดตั้ง module และเพิ่มมันเข้าไปในไฟล์ package.json (ข้างใน dependencies)
• npm install module_name –save-dev
เหมือนกันกับข้างบน ติดตั้ง module และเพิ่มมันเข้าไปในไฟล์ package.json (ข้างใน dependencies) และบอกว่าจะนำมาช่วยในส่วนของนักพัฒนา
• npm list
แสดงรายการ modules ทั้งหมดที่ติดตั้งไปแล้วในโปรเจคของเรา
• npm list -g
แสดงรายการ modules ระดับ global ทั้งหมดที่ถูกติดตั้งบน OS ของเรา
• npm remove module_name
uninstall module ออกจากโปรเจคของเรา
• npm remove -g module_name
uninstall module ระดับ global
• npm remove module_name –save
uninstall module ออกจากโปรเจคของเรา พร้อมทั้งนำออกจาก attribute dependencies ด้วย (ในไฟล์ package.json)
• npm remove module_name –save-dev
เหมือนกันกับด้านบน uninstall module ออกจากโปรเจคของเรา พร้อมทั้งนำออกจาก attribute dependencies ด้วย (ในไฟล์ package.json)
• npm update module_name
update เวอร์ชัน module ให้ใหม่ล่าสุด
• npm update -g module_name
update เวอร์ชัน module ให้ใหม่ล่าสุด ในระดับ global
• npm -v
แสดงเวอร์ชันปัจจุบันของ npm
ป.ล. module_name คือ ชื่อ module/library ที่เราต้องการติดตั้งครับ
1. PHP Manual: Migrating from PHP 5.6.x to PHP 7.0.x
https://secure.php.net/manual/en/migration70.php
2. PHP 7 UPGRADING doc
https://github.com/php/php-src/blob/PHP-7.0.0/UPGRADING
3. PHP 7 Requests for Comments
https://wiki.php.net/rfc#php_70
4. PHPNG (next generation)
https://wiki.php.net/phpng
5. Getting Ready for PHP 7
https://www.digitalocean.com/…/blog/getting-ready-for-php-7/
6. What to Expect When You’re Expecting: PHP 7, Part 1
https://blog.engineyard.com/2015/what-to-expect-php-7
7. What to Expect When You’re Expecting: PHP 7, Part 2
https://blog.engineyard.com/2015/what-to-expect-php-7-2
8. Zend: 5 Things You Must Know About PHP 7
http://www.zend.com/en/resources/php-7
9. The PHP 7 Revolution: Return Types and Removed Artifacts
http://www.sitepoint.com/php-7-revolution-return-types-rem…/
10. PHP 7: 10 Things You Need to Know
http://www.hongkiat.com/blog/php7/
11. #php7 on Twitter
https://twitter.com/hashtag/php7
12. GoPHP7 Extensions Project
http://gophp7.org/gophp7-ext/
13. Laracasts – PHP 7 Up and Running
https://laracasts.com/series/php7-up-and-running
.
แถม ใครใช้ Ubuntu 14.04, 15.04, และ 15.10 สามารถติดตั้ง PHP 7 เพียงได้ 3 คำสั่ง ดังนี้
sudo add-apt-repository ppa:ondrej/php-7.0
sudo apt-get update
sudo apt-get install php7.0
——————————
ขอให้สนุกกับการเรียนรู้ครับ
1. Material Design Lite (ของ google)
http://www.getmdl.io/
2. Material UI
http://www.material-ui.com/#/home
3. Bootswatch Paper
http://bootswatch.com/paper/#
4. MUI
https://www.muicss.com/
5. Leaf
http://getleaf.com/
6. Materialize
http://materializecss.com/
7. Polymer
https://www.polymer-project.org
8. Angular Material
https://material.angularjs.org/latest/
9. LumX
http://ui.lumapps.com/
10. daemonite material
http://daemonite.github.io/material/index.html
11. Angular 2 Material
https://material.angular.io/
12. MATERIAL DESIGN FOR BOOTSTRAP 4
http://mdbootstrap.com/
13. Material design theme for Bootstrap 3
http://fezvrasta.github.io/bootstrap-material-design/
14. Material Framework
http://nt1m.github.io/material-framework/#introduction
15. Material Foundation
http://eucalyptuss.github.io/material-foundation/
16. Essence
http://getessence.io/