Trình bày những kiến thức cơ bản nhất về scilab,latex và web (gồm (X)HTML, CSS và javasccipt)

Trình bày những kiến thức cơ bản nhất về scilab,latex và web (gồm (X)HTML, CSS và javasccipt)

TRƯỜNG ĐẠI HỌC BÁCH KHOA HÀ NỘI

VIỆN CÔNG NGHỆ THÔNG TIN VÀ TRUYỀN THÔNG

——————– * ———————

BÁO CÁO

MÔN HỌC

NHẬP MÔN CÔNG NGHỆ THÔNG TIN

Nhóm sinh viên thực hiện : 1 Nguyễn Anh Quân

Giáo viên hướng dẫn : PGS TS.

Lê Thanh Hương

HÀ NỘI Ngày 11 tháng 12 năm 2013

Lời cảm ơn

Chúng em xin chân thành cảm ơn cô Lê Thanh Hương và các thầy dạy thực hành

đã tận tình truyền đạt kiến thức cho chúng em trong những giờ lên lớp lý thuyết cũngnhư thực hành Qua đó, chúng em đã nắm được những kiến thức cơ bản nhất trongngành Công nghệ thông tin nói chung và bộ môn Nhập môn Công nghệ thông tin nóiriêng

Mục đích của báo cáo

Chúng em là những sinh viên mới trong ngành Công nghệ thông tin Đây là mộtngành khoa học có tốc độ phát triển rất nhanh do đó chúng em cần có một nền tảngkiến thức vững chắc, những đường hướng tư duy hợp lý mới có thể đáp ứng kịp nhữngbước tiến của ngành

Dưới sự hướng dẫn nhiệt tình của các thầy cô chúng em đã học tập và nghiên cứunhững kiến thức cơ bản nhất trong ngành Công nghệ thông tin; trong đó phải kể đến

ba công cụ Scilab, Latex, Web Đây là những công cụ hữu hiệu giúp sinh viên Côngnghệ thông tin chúng em có thể dễ dàng tiếp cận cũng như giải quyết các vấn đề trongquá trình học tập và làm việc sau này

Nhận thấy tầm quan trọng của ba công cụ Scilab, Latex, Web chúng em đã tập hợpmọi lý thuyết thu thập trong những giờ lên lớp của các thầy cô, đồng thời dày côngtìm hiểu và nghiên cứu sâu hơn để viết vào bản báo cáo này, coi như đây là một giáotrình bổ ích cho chúng em nói riêng hay các sinh viên Công nghệ thông tin nói chung,

và cũng là để lưu trữ những gì chúng em đã học được, tránh tình trạng mai một kiếnthức

Tóm tắt nội dung

Trong bản báo cáo này, chúng em trình bày những kiến thức cơ bản nhất về Scilab,LaTex và Web (gồm (X)HTML, CSS và JavaSccipt) Đây là những vấn đề đơn giảnnhưng hết sức quan trọng để chúng em có thể tiếp tục học tập và nghiên cứu về Côngnghệ Thông tin

Về Scilab:

• Cách cài đặt và chạy Scilab

• Các kiểu dữ liệu và toán tử cơ bản của Scilab

• Các khái niệm cơ bản về WWW

• Khái niệm cơ bản về (X)HTML, CSS, JavaScript

• Một vài vấn đề trong thiết kế Web

• Web: Đây là những kiến thức cơ bản nhất để chúng em có thể tự

thiết kế một trang web cá nhân cũng như cho tập thể

Chương 1: Scilab

1.1 Giới thiệu chung

• Scilab là ngôn ngữ lập trình kết hợp với các phần toán số học trênnhiều lĩnh vực khoa học

• SciLab thuộc loại ngôn ngữ thông dịch

• Khả năng xử lý với Scilab:

• Số học tuyến tính, ma trận thưa

• Các hàm ma thức và các hàm hữu tỷ

• Xử lý đồ thị 2D, 3D

• Giải các phương trình vi phân, phương trình đại số

• Download và cài đặt: http://www.scilab.krg/product/scilab/download

Cài đặt như các phần mềm thông thường Để cài đặt đầy đủ các module, máy tínhcần nối mạng

1.2 Phương thức tương tác với Scilab

• Console (Hình 1.1), Editor (Hình 1.2), kèm khả năng Docking (Hình1.3)

• Sử dụng hàm exec

• Xử lý theo lô

File sci và sce để dễ quản lý code

– File sci: chứa một hay nhiều hàm tự viết Các hàm này sau đó

sẽ đươc load vào môi trường Scilab khi gọi getf

– File sce chứa cả các hàm tự viết và mã lệnh thực thi củaScilab

1.3 Sử dụng help trong Scilab

Nếu biết tên lệnh nhưng quên hoặc chưa biết cú pháp có thể dùng lệnhhelp <name> với <name> là tên lệnh cần tra Ví dụ:

help sin // cho biết cú pháp của hàm sin

help + // help của toán tử

Nếu không biết rõ tên lệnh, có thể dùng lệnh apropos để tìm thông tinliên quan với từ khóa.Ví dụ:

apropos logarithm // Cho kết quả là các hàm liên quan đến logarithm

1.4 Các loại biến trong Scilab

Trong Scilab, các loại biến đều được coi là ma trận (trừ một số loạinhư lists và một số cấu trúc dữ liệu đặc biệt) Bao gồm: biến thực,biến boolean, biến phức, biến xâu, ma trận (bao gồm cả vector) Với mỗikiểu biến có một số toán tử tương ứng

Tên biến: Độ dài tùy ý nhưng chỉ xét 24 ký tự đầu tiên Mã ASCII:a-z, A-Z,

0-9,%_#!?$ Có phân biệt chữ hoa, chữ thường

Một số hàm toán học cơ bản: sin(x), asin(x), coo(x), acos(x), tan(x), atan(x),

cotg(x), acst(x),

1.5 Ma trận, vector

1.5.1 Khởi tạo ma trận

Các ký hiệu dùng để khai báo ma trận:

• Ngoặc vuông “[” và “]” để đánh dấu vị trí bắt đầu và kết thúc của

ma trận

• Dấu phẩy “,” để phân chia các giá trị giữa các cột.

• Dấu chấm phẩy để phân chia các hàng

Ngoài ma có một số hàm như ones, eye, zeros, rand để khởi tạo một số dạng ma trậnđặc biệt

1.5.4 Xây dựng và tính toán đa thức

Xây dựng đa thức Ví dụ xây dựng đa thức: X2 - 3 * X - 4

Nếu v là vector chứa các hệ số từ thấp đến cao

v = [-4 -3 1] p = poly (v, ‘x’, ‘coeff’)

Cách khác Khởi tạo một đa thức là “x” và áp dụng các phép toán để xây dựng đathức phức tạp hơn

Tính toán với đa thức Một số hàm như roots() để tìm nghiệm, horner()

để tính giá trị của đa thức với giá trị x nào đó, derivat() để tính đạohàm Ví dụ: với đa thức p = x2-3*x-4

z = roots(p);

Khi đó: z == [-1 4]’; horner(p,z) == [0 0]’; derivat(x) == -3 + 2*p;

1.5.5 Xây dựng và giải hệ phương trình

Với hệ phương trình có dạng A*x = b với A, b là hai ma trận chứa các hệ

Đồ thị cho dưới dạng điểm: với x, y lần lượt là 2 vector chứa hoành độ

và tung độ của các điểm trên đồ thị, có thể vẽ đồ thị bằng hàm:

plot2d(x,y, style = -1) tham số style là kiểu đồ thị được vẽ Ví dụ:hình 1.4

Hình 1.4: Đồ thị cho dưới dạng tập hợp điểm

Đồ thị cho dưới dạng hàm: Với x là vector chứa các giá trị của biến Sửdụng deff() và fplot2d() Ví dụ: deff("[y]=f(x)","y=x 2"); x = -4:0.1:4;fplot2d(x,f) (1.5)

Đồ thị trong không gian 3 chiều: Có thể vẽ đồ thị của hàm 2 biến trongkhông gian 3 chiều, tương tự trường hợp trên, dùng hàm “plot3d” và

“fplot3d”

Hình 1.5: Đồ thị cho dưới dạng hàm

Chương 2: LaTeX

2.1 LaTeX là gì?

LaTeX là một hệ thống sắp chữ, một ngôn ngữ biểu diễn văn bản dẫn xuất

từ TeX

Phiên bản mới nhất:LaTeX2e

Tác giả: Lesile Lamport

Ưu, nhược điểm

Ưu điểm:

• Soạn thảo văn bản lớn không ảnh hướng đến tốc độ gõ Với Word hoặcOpenOffice, cả tài liệu sẽ bị định dạng lại khi ta gõ

• Tài liệu LTeX thường có vẻ chuyên nghiệp hơn các tài liệu khác

• Gõ công thức tiện lợi

• Phải nhớ tên lệnh (hoặc phải có tài liệu))

• Hơi khó khăn khi bắt đầu

2.2.3 Một số kí tự đặc biệt

Những kí tự sau là các kí tự dành riêng Nó có thể là kí tự có ý nghĩa đặc biệt trongLaTeX hay nó không thuộc vào bất kì một font chữ nào Khi bạn nhập chúng một

cách trực tiếp thì thông thường chúng không được in ra và đôi khi báo lỗi Các kí tựđặc biệt đó là:#$%"&_{}’\ Để sử dụng các kí hiệu trên, cần thêm vào một dấu gạchchéo phía trước (\), với kí tự gạch chéo thì dùng: \textblackslash.

2.2.4 Lệnh trong LaTeX

Các lệnh của LaTeX phân biệt chữ hoa, chữ thường Cấu trúc lệnh:

\tên lệnh{tham số bắt buộc}[tham số tùy chọn]

2.2.6 Một số engine và front-end dùng đẻ soạn thảo

Engine

• Windows: MiKTeX Link: http://miktex.org/

• Linux: TeX Live

Front-end

• Texmaker (httt://wmw.xm1math.net/texmaker/) Chạy được trên

Windows, Linux và MacOS (Hình 2.1)

• TexnicCenter (http://www.teXniccenter.org/)

2.3 Cấu trúc tổng quát của một tập tin mã nguồn

2.3.1 Lệnh documentclass

Dùng để khai báo loại tài liệu Tham số “class” để khai báo loại tài liệu, bao gồm:article, proc, minimal, report, book, slides, letter Các tham số tùy chọn để tùy chỉnhmột số định dạng của loại tài liệu như kích thước trang giấy, kích thước font mặcđịnh,

2.3.2 Khai báo package

Sử dụng lệnh \usepackage[ ]{tên package} Trong đó hàm số tùy chọn đểđặt Các thông số cho package sử dụng Ví dụ:

teletypefont sansserif innghiêng inđậmkích thước font

Khai báo Môi

normalsizelargeLargeLARGEhugeHuge

2.5.2 Môi trường

Cấu trúc

\begin{tên môi trường} nội dung \end{tên môi trường}

Môi trường tạo danh sách, miêu tả

Để tạo danh sách không đánh thứ tự: dùng môi trường itemsize , để tạo danh sách cóđánh thứ tự: dùng môi trường enumerate , để tạo môi trường dùng để miêu tả: dùngmôi trường description

Môi trường dùng để căn lề

• Căn lề trái: dùng môi trường flushleft

• Căn lề phải: dùng môi trường flushright

• Căn giữa: dùng môi trường center

Môi trường trích dẫn

Môi trường “quote” sử dụng với trích dẫn, những câu quan trọng và ví dụ

Môi trường “quotation” sử dụng với trích dẫn dài, có nhiều đoạn văn, dòng đầu tiênmỗi đoạn sẽ được indent

Môi trường “verse” sử dụng để trích dẫn thơ

Môi trường tạo bảng biểu

Dùng môi trường tabular Cấu trúc:

\begin{tabular}[pos]{table spec}

% nội dung \end{tabular}

Tham số “pos” để chỉ ra vị trí của bảng so với chữ ở xung quanh

Trong bảng: hai cột liên tiếp ngăn cách bằng dấu & , hai hàng liên tiếpngăn cách bằng dấu \\ Để tạo đường kẻ giữa 2 dòng dùng \hline

2.6 Soạn thảo công thức toán học

Nếu công thức ngắn, viết ngay trong văn bản thì có thể dùng: $ côngthức $ Với công thức dài hơn, dùng môi trường equation hoặc equation*nếu không muốn đánh số

2.6.1 Một số ký hiệu

\lambda, \xi, \pi, \theta, \mu, \Phi, \omega, \Delta

2.6.2 Mũ, chỉ số dưới, căn thức, phân thức

2.6.3 Khoảng cách trong chế độ toán học

Để tạo khoảng cách giữa hai công thức liên tiếp có thể dùng lệnh \quad hoặc \qquad

để tạo khoảng cách lớn hơn Ví dụ:

\begin{eqnarray*} f & = & x ˆ2 + x\\f’ & = & 2x + 1 \end{eqnarray*}Kết quả:

f = x2 + x

f’ = 2x +1

2.7 Tham chiếu trong văn bản

Dòng lệnh \label{marker} để tạo tham chiếu, lệnh \ref{mabker} để tham

chiếu đến vị trí đã đánh dấu hoặc \pageref{marker} để tham chiếu đếntrang có label đó.

angle: Xác định góc quay của ảnh (ngược chiều kim đồng hồ)

2.8.2 Tạo tiêu đề cho ảnh

Dùng thêm môi trường figure và lệnh caption Ví dụ:

\begin{figure}

\includegraphics{vidu.jpg}

\caption{Vi du tieu de anh}

\end{figure}

Chương 3

HTML - XHTML, CSS, JavaScript

3.1 Một số khái niệm cơ bản về WWW

3.1.1 Khái niệm về siêu văn bản

Hypertext là văn bản (text) trên máy tính có sự liên kết đến một văn bản khác và cóthể truy cập trực tiếp thông qua click chuột, nhấn phím

Hyperlink là một liên kết từ một file hypertext đến một file khác

Hypermedia là sự mở rộng của hypertext, trong đó đối tượng có thể là văn bản, đồhọa, âm thanh, video

3.1.2 Các thành phần của Web

• Web là hệ thống các tài liệu hypertext liên kết với nhau thông quamạng Internet

• Các thành phần của Web

– WebPage: là mọt trang Web

– Website: Là tập hợp các WebPage có nọi dung thống nhất

– Uniform Resource Locator: dùng để định vị tài nguyên trênInternet theo cách thuận tiện cho người sử dụng (thay cho địachỉ IP không mang ý nghĩa và khó nhớ)

Cấu trúc: giao thức://địa chỉ máy:con đưòng đẫn đến tài nguyên

– Web Server: cung cấp tài nguyên cho máy khác

– Web Browser: dùng để khai thác dịch vụ Web

3.2 Một số công cụ thường dùng để tạo trang

(X)HTML, CSS, JavaScript

1 Dreamweaver: Là công cụ có phí, mạnh, dễ sử dụng (Hình 3.1)

2 Notepad++: Là công cụ miễn phí, nguồn mở tuy nhiên không mạnh

bằng, chỉ có tính năng highlight và auto-completion tuy nhiên kháhạn chế Link: http://notepad-plus-plus.org/ (Hình3.2)

HTML và XHTML đều được tạo thành từ các tags (gồm tag mở và tag đóng) để địnhnghĩa cách hiển thị các thành phần của trang web.

Các phiên bản

Phiên bản chính thức mới nhất của HTML là HTML 4.01, HTML 5 đang là dự thảovới nhiều tính năng mới Phiên bản đầu tiên của HTML được Tim Berner Lee phátminh và được W3C đưa thành chuẩn vào năm 1994, phiên bản mới nhất là 4.01 hiệntại được hoàn thành vào 24-12-1999 Phiên bản chính thức mới nhất của XHTML làXHTML 1.1, ra đời vào tháng 5 năm 2001

3.3.2 Cú pháp của các tags (thẻ) trong (X)HTML

Bao gồm 1 thẻ mở và 1 thẻ đóng, nội dung nằm ở giữa 2 thẻ, các thẻ có thể lồngnhau nhưng các thẻ phải được mở và đóng đúng thứ tự (mở trước thì phải đóng sau)

Ớ thẻ mở có thể có các thuộc tính (attributes)

Ví dụ:

<div class="ex"><b><i>Chữ này vừa được in đậm vừa được in nghiêng và

có thế chứa các lệnh định dạng của class “ex"</i></b></div>

Với XHTML thì tên các thẻ bắt buộc viết thường, với HTML thì không phân biệtchữ thường chữ hoa Tuy nhiên các trình duyệt thường không thông báo lỗi cú phápnhưng sẽ dẫn đến kết quả hiển thị không đúng mong muốn và khi validate (3.3.5) sẽbáo lỗi

+ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Trxnwitional//EN"

"http://wws.w3.org/TR/xhtml1/DTD/ahtml1-transitional.dtd">

+ <!DOCTYPE hhml PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"

"tttp://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

Phần head dùng để chứề 1 số thẻ như <title> Chứa tiêu đề của trang web

<link> Chứa link đến một số file như style sheet (CSS) hoặc JavaScript

<style> Đưa một số mã CSS vào trang web

<script> Đưa một số đoạn script vào trang web

<meta> Thêm một số thông tin như keyword, description để miêu tả trangweb (phục vụ các search engine)

Một số thẻ khác như <base>, <object>

Phần body: Dùng để chứa nội dung chính của trang web

3.3.5 Validate một trang web

Là công việc để kiểm tra xem trang web đó có tuân thủ đầy đủ theo cácchuẩn của W3C không, mục đích để đảm bảo tối đa việc hiển thị đúng trêncác trình duyệt

Có thể validate bằng cách vào trang http://validator.w3.org hoặc dùng 1

số addons của Các trình duyệt như Html Validahor (Firefox, Chrome)

3.3.6 Một số thẻ hay dùng

Các thẻ nhối (block-level) thường dùng

Là các thẻ hiển thị trên màn hình dưới dạng một đoạn riêng Ví dụ:

Một số thẻ để chèn nội dung đa phương tiện

• Thẻ <img> dùng để chèn hình ảnh Thuộc tính “src” để chỉ ra đườngdẫn đến file ảnh, thuộc tính “alt” (alternative) sẽ hiển thị trongtrường hợp trình duyệt không hiển thị được ảnh hoặc không đượchiển thị ảnh, cũng có thể được dùng trong các chương trình đọc mànhình để hỗ trợ người khuyết tật, các máy tìm kiếm cũng dùng thuộctính này để lập chỉ mục cho web Hiện nay nhiều trình duyệt hiểnthị thuộc tính này như một chú thích cho ảnh khi di chuột vào

Ví dụ: <img src="example.jpg" ait="Example image" />

• Thẻ <object> để chèn flash, nhạc, phim

3.3.7 Form trong (X)HTML

Form trong (X)HTML cho phép người dùng nhập thông tin để gửi về máychủ Form trong (X)HTML được đặt trong thẻ <form>

Một số thuộc tính của thẻ <form>:

• action: địa chỉ trang web hoặc chương trình ở server xử lý dữ liệucủa form

• method: chỉ ra cách thức dữ liệu được gửi về server: có 2 cách:

“get” và “post”

Một số công cụ để nhập dữ liệu trong form:

• Với thẻ <input> có thể tạo ra các ô nhập dữ liệu, các nút tùy vàothuộc tính “type” Một số giá trị của thuộc tính “type”:

Text: Tạo ra textbox

Password: Tạo ra ô nhập password.

checkbox: Tạo ra ô chọn có thể chọn nhiều giá trị một lúc

radio: Tạo ra ô chọn, chỉ được chọn 1 trong số các ô

submit: Tạo ra nút để gửi dữ liệu về server

reset: Tạo ra nút để đưa giá trị các ô trong form về trạng thái mặc định

• Với thẻ <textarea> có thể tạo ra ô cho phép nhập liệu dữ liệu nằmtrên nhiều dòng

• Với thẻ <select> có thể tạo ra danh sách lựa chọn Thẻ <option>

để chỉ ra các lựa chọn Nếu thẻ <select> không thiết lập thuộctính “multiple” và “size” thì sẽ có một drop-down box, nếu không

sẽ có một danh sách Ví dụ:

<select name="color"> <option value="red">Đỏ</option> <option

value="green">Xanh lá cây</option> <option

vallue="yellow">Vàng</ottion> </selecp>