Categories
Javascript

Typescript và những vùng đất mới

typescript

Thế là đã hết tuần đầu tiên của 2017, mọi người đã học được gì mới chưa? Giờ rãnh rỗi mới dành chút thời gian viết về Typescript, một thứ “ngôn ngữ” mới đã tranh thủ học được trong mấy ngày qua và chia sẻ một số góc nhìn cá nhân về Typescript. Đây cũng là bài khai trương năm 2017, hy vọng cả năm thăng hoa với nghiệp code và tổ nghiệp phù hộ làm ăn phát đạt.

Categories
PHP Search Engine Optimization User Interface Design & Usability Web Design Web Programming

Tôi biết PHP, tôi có ý tưởng, tôi phải làm web

Cách đây 2 tuần, 1 dự án website dựa trên cảm hứng đã ra đời (http://loving.vn), tính ra thời gian kể từ ý tưởng cho tới sản phẩm khoảng hơn 1 tháng. Hôm nay, mình cũng rất vui mừng publish một site khác, site này khá độc đáo ở chỗ từ khi xuất hiện ý tưởng cho tới thành phẩm chỉ 1 tuần (tức là cách đây 1 tuần ^^), địa chỉ của em nó là http://tukhoa.info.

Đây là dự án thứ 2 trong năm nay nhằm thử nghiệm ý tưởng là lạ để thăm dò nhu cầu web. tukhoa.info là một site được triển khai khá thú vị và đầy thử thách đó là cả project có tổng dung lượng < 100KB và hoàn toàn không sử dụng 1 hình ảnh nào. Cũng thú vị một chỗ là cả dự án chỉ có 1 file php –> code phê luôn :D. Website lấy từ khóa làm trung tâm, bởi thế hệ web tương lai hay mạng ngữ nghĩa có thể bị chi phối nhiều bởi từ khóa chứ không phải câu văn, đoạn văn hay hình ảnh, đơn giản là từ khóa và mối quan hệ, tương quan của từ khóa này với từ khóa khác. Chính vì thế mà tukhoa.info ra đời.

Categories
Javascript Web Design Web Programming

Javascript và những điều cần biết

javascript-fundamental-banner

Nếu bạn là 1 Web Developer, thì hẳn các bạn cũng đã từng Code Javascript ít nhất 1 lần. Javascript chính là nhân tố sống còn trong các thiết kế web hiện nay bởi nó giúp cho cái web khô khan của chúng ta trở nên mượt mà và vận hành trơn tru hơn.

Hôm nay mình sẽ chia sẽ tới các bạn một số kinh nghiệm cũng như 1 số lời khuyên khi các bạn viết Javascript. Phạm vi bài này sẽ không phải hướng dẫn các bạn code Javascript mà nó sẽ giúp các bạn có 1 cái nhìn toàn diện hơn về các vấn đề mà 1 Coder cần quan tâm khi làm việc với Javascript.

Các vấn đề mình sẽ đề cập tới là:
1.Tại sao phải là Javascript?
2.Sử dụng Javascript IDE nào?
3.Minified Code là gì?
4.Obfuscated Code là gì?
5.Tại sao phải học thêm jQuery?

Categories
Javascript Web Programming

Detect scrolling bottom của thẻ DIV

detect-scrolling-to-bottom-of-a-div-banner

Đang triển khai cái dzụ Scrolling Ajax, tính kiếm cái plugin nào xài thử thì chẳng thấy cái nào tốt và phù hợp ý mình cả, thôi thì tự sướng. Scrolling Ajax là cái chức năng dàn trang cao cấp mà bạn không cần phải nhấn link để sang trang khác, chỉ việc dùng thanh cuộn, kéo xuống hết thì nó sẽ tự động load tiếp nội dung của trang sau (sử dụng Ajax). Sau 1 hồi phân tích thì cái khó nhất của vụ án Scrolling Ajax không phải là load ajax mà là…làm sao biết đang ở cuối trang.

Categories
Javascript PHP Web Programming

Tự động chuyển trang – Auto Redirect cho website

tu-dong-chuyen-trang-auto-redirect-banner

Hôm nay mình sẽ chia sẽ các bạn một chút kinh nghiệm trong vấn đề giải quyết việc tự động chuyển trang (Auto Redirect) đang xem tới 1 địa chỉ (URL) mà ứng dụng bạn muốn chuyển tới. Case Study ở đây là website của bạn bằng cách nào đó xử lý xong xuôi tại trang A và bây giờ bạn muốn tự động chuyển tới 1 trang B nào đó. Trang B có thể là 1 webpage của website của bạn hoặc một website khác.

Để giải quyết được vấn đề này hiện tại có 3 hướng giải quyết chính:
1.Sử dụng HTTP Status Code 301 (hoặc 302)
2.Sử dụng thẻ META của HTML
3.Sử dụng cơ chế Timeout của Javascript.

Categories
Javascript

location.href không làm việc trên IE6!

ie-suck-banner

Vừa mới giải quyết xong một vấn đề tưởng chừng như đơn giản trong javascript nhưng cực kỳ đáng ghét đối với thằng IE6 – đó là chức năng redirect sử dụng location.href.

Categories
Flash Javascript Web Design Web Programming

Upload nhiều File 1 lúc với Swfupload.org

logo-swfupload

Hôm nay mình muốn chia sẽ với các bạn làm web một công cụ khá hay để upload nhiều file cùng một lúc, không cần phải refresh trang, có thể gọi callback trong javascript để xử lý(giống như AJAX).

Chi tiết:
– Front-end: Javascript, Flash
– Back-end: bạn có thể sử dụng ngôn ngữ nào cũng được vì giao tiếp client-server theo hình thức POST, chỉ cần phía server bạn xử lý là ok.

Đây là một công cụ khá hay và không thể thiếu trong bộ sưu tập đồ nghề làm web của bạn.
Website: http://www.swfupload.org/
Demo: http://demo.swfupload.org

Categories
Javascript

Vấn đề hàm String.replace() của javascript chỉ replace một lần mà thôi.

Tình cờ phát hiện hàm String.replace() của javascript chỉ replace lần xuất hiện đầu tiên mà thôi. Ví dụ:

var myString = 'my blog of my friend here';

alert(myString.replace('my', 'his')); //output : "his blog of my friend here" . Not "his blog of his friend here".

xem ví dụ cũng đã hiểu, phrase “my” chỉ bị thay thế một lần mà thôi, hix hix..điều này đôi khi bạnkhông muốn vì đã replace thì replace cho hết luôn chứ (ví dụ như hàm str_replace() của PHP sẽ thay thế toàn bộ)

– Để giải quyết vấn đề này trước mắt mình thấy có 2 cách, cách hay sử dụng nhất là sử dụng regex pattern thay cho search string, mình sửa lại như sau thì sẽ có kết quả như ý muốn:

alert(myString.replace(/my/g, 'his')); //output : "his blog of his friend here".

Trong nhiều trường hợp mình không dùng cách sử dụng pattern được, thì có một giải pháp khác, đó là add thêm hàm replaceAll vào String object để sau này dùng. Cái hàm này chôm của một kiếm khách nào đó trên giang hồ. Cách này nên sử dụng cẩn thận, vì có thể sẽ bị infinitive loop nếu dùng không cẩn thận.

Prototype của nó như sau:

// Replaces all instances of the given substring.
String.prototype.replaceAll = function(
strTarget, // The substring you want to replace
strSubString // The string you want to replace in.
){
var strText = this;
var intIndexOfMatch = strText.indexOf( strTarget );

// Keep looping while an instance of the target string
// still exists in the string.
while (intIndexOfMatch != -1){
// Relace out the current instance.
strText = strText.replace( strTarget, strSubString )

// Get the index of any next matching substring.
intIndexOfMatch = strText.indexOf( strTarget );
}

// Return the updated string with ALL the target strings
// replaced out with the new substring.
return( strText );
}

Sau khi khai báo prototype này, thì bạn chỉ cần sử dụng như sau

alert(myString.replaceAll('my', 'his')); //output : "his blog of his friend here".

———-

Hy vọng chút ít kinh nghiệm sẽ giúp các bạn trong tương lai.

Categories
Web Programming

jQuery, AJAX và IE7

Hôm nay gặp cái bug thật là đáng ghét bởi vì IE7.
Như các bạn cũng biết mình sử dụng AJAX để load một phần trang web mà thồi (vd như mình dàn trang trong một thẻ div). Đối với một trang web bình thường, mình khai báo một chức năng jquery trong đoạn
$(document).ready(function()
{
...
});

ví dụ như thêm chức năng mouseover/mouseout cho một selector nào đó. Và các chức năng được khai báo sẽ được tự thực hiện đối với các selector(class/id) tìm được trong toàn bộ trang HTML.
Việc này diễn ra bình thường trong FF,IE6. Nhưng hôm nay, vì lý do test nên khi xài IE7 tự nhiên thấy sao không trigger được các chức năng được khai báo đối với các nội dung được load bởi AJAX.

Theo suy đoán, có lẽ IE7 khi sử dụng AJAX để load nội dung vào 1 thẻ (div chẳng hạn), thì nội dung này (DOM) sẽ không được jquery nhận ra các selector, do đó các chức năng của selector trong nội dung AJAX này sẽ không hoạt động.
Mình đã thử mang các hàm khai báo chức năng jquery này ra ngoài đoạn
$(document).ready(function()
{
...
});
mà mang vào load cùng với nội dung của AJAX, và đã thành công, ít ra là thành công thêm với IE7.
Một chút chia sẽ với các bạn.