Steven 的 IT 學習旅程

2016年3月26日星期六

JavaServer Faces References

General

Java EE 7 Platform API Specification: 查詢 Java EE 相關的 API
JavaServer Faces 2.2 Facelets Tag Library Documentation: JSF tag 文件
Package javax.faces.component Description: 說明 javafx.faces.component 套件中的類別, 提供 class diagram.
Java Platform, Enterprise Edition (Java EE) 7: Java EE 文件入口
The Java EE 7 Tutorial
TutorialsPoints: 提供許多的 Example:
JSF HTML Tag Reference (http://www.jsftoolbox.com/): 提供 tag 的說明及 render 後的畫面。
JSF 2.0 Tutorial (http://www.mkyong.com/) : 另一個提供 JSF 介紹的網站, 裡面的 Example 有非常詳盡的說明。
JSF Request Life-Cycle (圖片)

Converters and Validators

About Standard JSF Converters (Oracle.com): Provide the various converter and their full class name.

DateTime Converter

Date Format Pattern Syntax
Time Zone and Locale List

Validators

Customize validation error message in JSF 2.0

Locale

How to get a JSF resource bundle property value in backing bean?

另一個方法, 只需使用

ResourceBundle bundle = ResourceBundle.getBundle("resources.msgs");

即可。

Resource Bundles in JSF 2.0 Applications (Andy Gibson)

Events

Immediate attribute for UICommand and UIInput components

Ajax

f:ajax tag API

Tips

Reset the form

How do I reset input fields after a validation failure? by John Yeary
介紹 f:ajax 中的 resetValues 屬性及 f:resetValues 標籤的使用。

在JSF 2.2 後, 提供了 f:resetValues 標籤，放在 h:command 元件中。Example:

HTML5 and JSF

Josh Juneau, 2014. HTML5 and JSF.

Is It Possible to Bind An HTML5 Component (input type="“date”") To A Managed Bean Property?

HTML5 support in JSF 2.2

Others

Useful posters of the GoF patterns

2016年3月11日星期五

Business Process Modelling Notation References

BPM 模型介紹

BPMN 2.0 Tutorial
BPMN Tutorial - 5 Minute Basics of BPMN (youtube)

BPM Softwares

Overview

Comparison of Business Process Modeling Notation tools

Model Editors

Software Ideas Modeler
Yaoqiang BPMN Editor - an Open Source BPMN 2.0 Modeler (added on 2013/03/12)
Camunda Modeler (by Camunda.org) (added on 2013/03/12)

支援中文
Online demo
Based on bpmn.io

2016年3月2日星期三

data.frame 中的 row 及 column 操作, 使用 dplyr 套件

Row Operations

Filtering and slicing rows

slice()
filter()

Sorting rows

arrange()

Select distinct rows

distinct()

Column Operations

Column Selecting and rename

select()

Add new column

mutate()

Column-wise descriptive statistics

summarise()
注意 column name 的英文大小寫有別

 #對 iris 中的萼片長度計算平均值及變異數  
 data("iris")  
 summarise(iris, mean.SL=mean(Sepal.Length), sd.SL = sd(Sepal.Length))

結果:

Group-wise + Column-wise descriptive statistics

group_by() + summarise()

使用 group_by() 會產生另外一個 data.frame, 其中會包含 grouping 的資訊.

這個分群後的 data.frame 進到 summarise() 函數時, summarise()會看到 data.frame 中的分群資訊, 自動會去計算分群後各 column 的統計量. 使用 str() 可以看到 data.frame 中的分群資訊。

範例:

 # 對 iris 以 species 欄位進行分群, 再計算每群的萼片長度計算平均值及變異數  
 iris.grouped <- group_by(iris, Species)  
 summarise(iris.grouped, count=n(), mean.SL=mean(Sepal.Length), sd.SL=sd(Sepal.Length))

結果:

參考資料:

Jaynal Abedin and Kishor Kumar Das, Data Manipulation with R, 2nd, Packt Publising, 2015

2016年2月25日星期四

架站-新手

Alannah Moore 著、Muki Wu 譯, WordPress 七天速成班－打造吸睛的風格化網站與部落格 (Create Your Own Website Using WordPress in a Weekend)
Pseric, WordPress Plugins 百大外掛精選, 博碩, 2014
直接使用 wordpress 架站 https://zh-tw.wordpress.com/
Wordpress 新手 (codex.wordpress.org)

網站維護

安裝 plugin 時不使用 FTP (http://stackoverflow.com/questions/640409/can-i-install-update-wordpress-plugins-without-providing-ftp-access)

WP 網站功能擴充

頁面編輯 Live Composer Page Builder plug-in

一般介紹
Live Composer: How to add blog posts carousel (Youtube)
Live Composer: Post Template (livecomposerplugin.com)
Live Composer 試玩區
說明文件
Image 元素的 Lightbox 功能，讓你點選圖片後，以 Overlay 的方式顯示圖片。(https://livecomposer.help/article/204-how-to-open-an-image-in-a-lightbox)

多語系頁面 The WordPress Multilingual Plugin

電子商務 WooCommerce

社群分享 Super Socializer

自定 CSS WP Add Custom CSS

流量追蹤碼埋設 Tracking Code Manager by IntellyWP

圖片尺寸最佳化 EWWW Image Optimizer

為 Menu 加上 icon Menu Icons by Dzikri Aziz and joshuairl.

網站設計&規劃

一般規劃

Ethan Watrall , Jeff Siarto 著、莊惠淳譯, 深入淺出網站設計 (Head First Web Design)

HTML/CSS/JavaScript

Elisabeth Robson, Eric Freeman 著、莊惠淳譯, 深入淺出 HTML and CSS(第二版) (Head First HTML and CSS, 2/e). [書籍介紹]
Eric T. Freeman, Elisabeth Robson 著、蔣大偉譯, 深入淺出 JavaScript 程式設計 (Head First JavaScript Programming) [書籍介紹]

Mockups

9 Excellent Tools for Design Mockups
Balsamiq Mockups: Desktop and online mock-up.
Moqups.com : Online mock-up.
Responsive Design with Mockups (balsamiq.com)

Style Guide

Web Style Guide from Western University (pdf)
Page Structure and Site Design (Excerpted from Web Style Guide)

網站易用性設計

Janice (Ginny) Redish, Letting Go of the Words, Second Edition: Writing Web Content that Works (Interactive Technologies)
Steve Krug 著、胡為君譯, 如何設計好網站 (Don't Make Me Think: A Common Sense Approach to Web Usability, 2/e)
Steve Krug 著、陳亦苓譯，深度測試－提高網站效益 (ROCKET SURGERY MADE EASY: The Do-It-Yourself Guide to Finding and Fixing Usability Problems) (DIY 一次搞定網站易用性問題), 上奇資訊
UX Design: An Introduction with Scout Stevenson (youtube, 58:06)
Example Usability Test with a Paper Prototype (youtube)
Usability.gov (提倡網站易用性的組織)
Garrett, Jesse James (2010). The Elements of User Experience: User-Centered Design for the Web and Beyond. New Riders Press. ISBN 978-0321683687.
Jeff Johnson, 2014. Designing with the Mind in Mind: Simple Guide to Understanding User Interface Design Guidelines, 2nd edition, Morgan Kaufmann.

Color Palettes

Color Palettes Color Schemes (www.color-hex.com): 利用 keyword 找到 color palette.
Adobe Color CC
Color Palette FX: 上傳圖片產生圖片的 color palette.

CSS

CSS box model

素材

其它

Word to html: 想把 Word 的內容變成網頁, 但是直接 copy & paste 又太多的奇怪 html code, 可以試試此網址的方案。轉出文字後，圖片還是要手動貼.

2016年2月10日星期三

Nested Blocks in PL/SQL

PL/SQL 中提供 Nested Blocks 的功能, 其目的為:
* Use to handle exception locally (Codes from Tony Andrews):

begin
   for emp_rec in (select * from emp) loop
      begin
         my_proc (emp_rec);
      exception
         when some_exception then
            log_error('Failed to process employee '||emp_rec.empno);
      end;
   end loop;
end;

* Declare local variables that have limited scopes (Codes from Tony Andrews);

declare
    l_var1 integer;
    -- lots of variables
begin
   -- lots of lines of code
   ...
   for emp_rec in (select * from emp) loop
      declare
         l_localvar integer := 0;
      begin
         -- Use l_localvar
         ...
      end
   end loop;

end;

Reference:
When should I nest PL/SQL BEGIN…END blocks? (http://stackoverflow.com/questions/2334659/when-should-i-nest-pl-sql-begin-end-blocks)

PL/SQL interview question 001

Uri Lukach 提供了以下的 PL/SQL interview question[1]:

答案是 C.

使用 case-when expression 時有兩種方式, 一為 simple-case-expression, 另一為 searched-case-expression. 使用 searched-case-express 時, 若在 condition 中沒有使用 relational operator 便會產生 ORA-00920 invalid relational operator 的例外[2]。

但是, 我們不能將問題中的 condition 改成 v_input = TRUE, 因為此 case-when expression 是在 SELECT SQL statement 中使用，SQL engine 中沒有 boolean data type (只有在 pl/sql 中才有 boolean data type)。

以下正確執行的版本供參考:

 set serveroutput on  
 DECLARE  
 v_input boolean :=true;  
 v_result varchar2(10);  
 BEGIN  
 v_result := case   
    when v_input=true then 'TRUE'  
    when (v_input <>true) then 'FALSE'  
    else null  
    end;  
 DBMS_OUTPUT.PUT_LINE(v_result);  
 END;  
 /

2016年2月5日星期五

UI Elements in the Wordpress

常用的 WordPress UI 元素

Notification

Push notification for WordPress (Lite):Send push notifications to iOS, Android, and Fire OS devices when you publish a new post (https://wordpress.org/plugins/push-notifications-for-wp/(

InfoBar Top Notification: A easy and quick way to add top notification bar and call to action for your site. (https://wordpress.org/plugins/infobar/)

Buttons

MaxButtons Plugin: WordPress button plugin so powerful and easy to use anyone to create beautiful buttons and social share icons. (https://wordpress.org/plugins/maxbuttons/)

Images

Image Widget: A simple image widget that uses the native WordPress media manager to add image widgets to your site. (https://wordpress.org/plugins/image-widget/)

Tabs

Tabby Responsive Tabs: Create responsive tabs inside your posts, pages or custom post content by adding simple shortcodes inside the post editor. (https://wordpress.org/plugins/tabby-responsive-tabs/)
Simple Side Tab: Display a side tab that you can easily link to any page. Customize the tab text, font and colors. It's that simple. That's Simple Side Tab. (https://wordpress.org/plugins/simple-side-tab/)

Progress Bar

Progreaa Bar: A simple progress bar shortcode that can be styled with CSS (https://wordpress.org/plugins/progress-bar/)

Info/Message Box

WP Fancy Message Box: Display Fancy CSS Message Box in Page/Post via short code (https://wordpress.org/plugins/wp-fancy-message-box/)

Icon

WP SVGA Icon: Quickly and effortlessly enable 490+ beautifully designed SVG font icons, available on the frontend and backend of your site. (https://wordpress.org/plugins/svg-vector-icon-plugin/)

Font Awesome (http://fortawesome.github.io/Font-Awesome/)

網頁

2016年3月26日 星期六