2014年6月27日 星期五

『JSP』Implicit Object 隱含式物件


在 jsp 網頁裡面,有些物件已經有定義好了,而且不用宣告即可使用

Implicit Object Data Type Description Type
request javax.servlet.http.HttpServletRequest 請求端 I/O
response javax.servlet.http.HttpServletResponse 回應端 I/O
out javax.servlet.jsp.JspWriter 資料流輸出 I/O
page java.lang.Object 如同 this Servlet
config javax.servlet.ServletConfig 當前頁面的ServletConfig Servlet
session javax.servlet.http.HttpSession 只在 HTTP 協定處理 Context
application javax.servlet.ServletContext 如同 getServletConfig()
.getServletContext()
Context
pageContext javax.servlet.jsp.PageContext 當前頁面的 PageContext Context
exception java.lang.Throwable 例外處理 Error

2014年6月23日 星期一

『Gitbook』用 Gitbook 寫一個教學的電子書

上面圖的內文請不要誤會,我沒有要談 swift language,我是因為看到這個 online help開始產生一點興趣,好奇著是不是有一個快速工具就搭建好的電子書,果然找到了!這套GitBook 是用 node.js 的 npm 管理工具搭建的一種建立電子書的套件,我們來看看要怎麼安裝跟建立文件

2014年6月20日 星期五

『JSP』取得 Checkbox 的值 (True or false value)

今天介紹一個小技巧,就是表單送出 checkbox 時,如何抓到 true 或 false 呢?

 先看看一個簡單的表單,裡面有兩個控制項,一個是 checkbox,一個是有含送出事件的按鈕,送出去之後我們利用 post 這個傳送方法,讓 index.jsp 接收

//index.jsp
  <form action="index.jsp" method="post">
    <input type="checkbox" name="chkEnable" value="true">
    <a href='javascript:;' onclick='parentNode.submit();'>送出</a>
</form>
我們讓這個 checkbox 控制像的值,給它一個 true 值,接收端只要輸入這一段就可以抓到是否有打勾的 true or false

 //index2.jsp
boolean chkEnable = Boolean.parseBoolean(request.getParameter("chkEnable"));  
收工

2014年6月7日 星期六

『JSP』建立 Spring MVC framework 專案


今天要來介紹一下如何建立新的 Spring MVC Framework 專案,我們知道 Spring 這個框架是一個廣泛應用的網站應用程式,Spring MVC的基於 Java EE 的 Servlet 和JSP技術和實現模組,這樣用 MVC 架構的話,在寫程式上面就更清楚每個功能的職責

開發環境:

  • mac
  • Eclilpse Java EE IDE (Kepler Service Release 2)
  • Java JDK 7
  • Tomcat 7

2014年6月5日 星期四

『Terminal』快速進入建立目錄下的位置

這個標題有點難下,總之想表達的是,有時候我們在目標位置用指令的方式建立資料夾之後,會想進入到建立好的目錄底下,我用畫面來呈現可能比較好表達~

一般的做法

先看一下我目前的目錄是 /Users/Weiju/ProjectsDevelop
我在這目錄底下建立資料夾,指令就用 mkdir  後面擺資料夾名字

之後在用 cd 進到 testdemo 目錄

2014年6月4日 星期三

『Node.js』即時聊天室 Part 1 : 基礎運用介紹 - Socket.io, express

學習新的語言,都有個萬年 hello world (各種語言的 Hello world @Wiki),我想 node.js 也不例外,不過這篇不介紹這個,想說明一個很有意思的功能,那就是即時的聊天室,在這個主題我會分幾個階段來說明,而在本篇會實作基礎的 Socket.io, express 的用法

建立專案

請先建立一個資料夾叫 chatroom,在目錄下建立一個 package.json 檔案,預計裡面要安裝兩個模組,一個是 socket.io,而另一個是 express web framework,一開始先定義好package.json 檔案
{
 "name": "chatroom", //專案名稱
 "version": "0.0.1", //版本號
 "private": true, 
 "dependencies": { //相依套件
  "socket.io": "1.0.3",
  "express": "4.4.0"
 }
如果不知道 dependencies 裡套件的版本的話,請在命令提示字元輸入
$npm info [your library name] version
存檔完畢之後,需要利用套件管理工具 npm 進行安裝,請輸入以下指令
$npm install
裝完之後,會自動建立 node_module 資料夾,裡面則包含 despendencies 所輸入的套件

建立聊天室頁面

我們假想聊天室基本款要有三個控制項,聊天內容區塊 + 輸入框 + 以及送出按鈕,因此我們在根目錄之下,建立一個 index.html 的靜態檔案,並且在畫面就像以下這樣
<div id="chat"></div>
<form id="send-message">
  <input id="message" size="40" />
  <input type="submit" value="Submit" />
 </form>

建立 Socket.io 並啟動服務

這個部分是個重頭戲的地方,直接看看程式,頁面的
  var express = require('express'),
    app = express(),
    server = require('http').createServer(app),
    io = require('socket.io').listen(server); 
網頁服務監聽的 port
 server.listen(3000);
頁面的啟動,送出設定的預設頁面
app.get('/', function(req, res){
    res.sendfile(__dirname + '/index.html');
});

io.sockets.on('connection', function(socket) {
    socket.on('send message', function(data){
       io.sockets.emit('new message', data);
    });
});
scripts 的部分
<script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script>
 <script src="/socket.io/socket.io.js" type="text/javascript"></script>
 <script type="text/javascript">
 $(function(){
  var socket = io.connect();
  var $frmMessage = $('#send-message');
  var $boxMessage = $('#message');
  var $chat = $('#chat');

  $frmMessage.submit(function(e){
   e.preventDefault();
   socket.emit('send message', $boxMessage.val().trim());
   $boxMessage.val('');
  });

  socket.on('new message', function(data){
   $chat.append(data + "<br />");
  });
 });
 </script>


   完成,未來會繼續補強一些功能喲

2014年6月1日 星期日

『Node.js』介紹 Express web framework 套件

聽說學 node.js 也要學 express 這個超強大的套件,今天我就來嘗試玩看看囉

開發環境:mac

首先先用 npm 安裝 express,由於我的環境是用mac,然後我的 .npm 的預設目錄是設定在 root 權限的 home 目錄夾,因此我下的語法要用這樣:
$sudo npm install -g express-generator