Hướng dẫn cài đặt phần mềm WebStorm dành cho sinh viên.

Chào bạn, mình đoán là sau khi bạn tìm kiếm bài viết này chắc chắn bạn là một lập trình viên theo hướng FrontEnd đúng không?

Công nghệ càng ngày càng phát triển, các công cụ lập trình cũng theo đó mà phát triển dần, cho nên hôm nay mình sẽ hướng dẫn cài đặt công cụ lập trình chuyên nghiệp cho công nghệ FrontEnd.

Còn một điều quan trọng là nếu bạn là sinh viên thì đều có một tài khoản email do trường cung cấp miễn phí do vậy việc cài đặt và sử dụng ứng dụng "xịn" này sẽ được miễn phí và gia hạn không tốn đồng nào cả...

Phần mềm WebStorm

tài khoản sinh viên được miễn phí hoàn toàn - gia hạn không tốn phí

1.Cách cài đặt phần mềm WebStorm

Bước 1: Nhấn vào link mình để ở đây

Link: https://www.jetbrains.com/webstorm/

Sau khi ấn vào link thì sẽ hiện ra giao diện như bên dưới, bạn ấn download để tải trang tiếp theo.

giao diện cài đặt phần mềm WebStorm

Để tải về máy => tiếp tục bấm download thêm lần nữa nhé.

giao diện cài đặt phần mềm WebStorm

Bước 2: Trong bước này, hầu hết các bạn đã biết là mình sẽ đúp chuột để tải về ở phía bên trái góc dưới màn hình,...Kích thước file mà mình tải nặng 367MB.

hướng dẫn tải phần mềm

Bước 3: Sau khi đúp chuột => Bấm Next để tiếp tục...

Mặc định cài đặt luôn nằm ở ổ đĩa C:\ vì để tránh bộ nhớ bị đầy thì mình lưu ở một ổ đĩa khác:

Browse: ở đây có thể thay đổi vị trí cài đặt...sau đó tiếp tục nhấn Next

chọn ổ đĩa để cài đặt dễ dàng

Bước 4: Cài đặt một số Options, tất nhiên là một lập trình viên FrontEnd thì không thể nào bỏ qua (html/css/js) => sau đó tiếp tục nhấn Next

lựa chọn Options

Bước 5: Cài đặt cần hoàn thành vì vậy bước này nhấn Install...

hướng dẫn cài đặt

Bước 6: Cài đặt hoàn thành rồi thì nếu muốn chạy phần mềm thì tick vào RunWebStorm rồi ấn Finish là được. Còn không cần thì nhấn Finish thôi là xong nhé.

hoàn thành cài đặt

2. Hướng dẫn sử dụng phần mềm WebStorm

Quá trình cài đặt đã được hoàn tất, bây giờ mở ứng dụng lên và tạo dự án thôi nào.

Khi mở ứng dụng giao diện sẽ hiện lên như hình bên dưới:

1. New Project: tạo một dự án mới mà bạn muốn
2. Open: Mở forder có sẵn hoặc tạo một forder cũng được luôn nhé
3. Get from VCS: Lấy source code từ Version Control

(chẳng hạn như: GitHub,...)

hướng dẫn sử dụng ứng dụng

Vì mình đã học qua Javascript thì tiếp đến mình sẽ thử tạo một project Node.js

(Node.js: là một hệ thống phần mềm được thiết kế để viết các ứng dụng internet có khả năng mở rộng, đặc biệt là máy chủ web)

1: Vị trí lưu project.

2: Node.js nên cài đặt trên máy trước.

Link Download: https://nodejs.org/en/download/

3: Câu lệnh để tạo project.( quá trình tạo project được WebStorm tạo sẵn, còn các công cụ khác thì phải gõ câu lệnh thế thôi)

Và bây giờ nhấn Create để tạo project thôi.

tạo dự án Node.js

Bạn nhấn Allow access để tiếp tục...

quá trình tạo project

Một tập tin package.json đã được tạo trong project của bạn

tập tin package.json

Bây giờ tạo thêm giúp mình file Javascript

1: Empty Project: nhấn vào đây

2: Location: Vị trí file bạn muốn lưu trữ

=> Sau đó nhấn Create để tiếp tục

tạo dự án mới

tạo file javascript

Trong giao diện nhấn Run -> Edit Configuration -> Add new -> Node.js

Thêm mới Configuration

Chọn file đã đặt tên trước đó để chạy chương trình

chọn file để chạy chương trình

Giờ thì có thể debug và chạy chương trình nhấn Shift + F10

chạy chương trình

3.Tạm kết

Thật tiện lợi đúng không, nếu bạn là một sinh viên mà không biết sử dụng Email cho việc gì thì hãy đăng ký và đăng nhập Jetbrains, sử dụng công cụ mà bạn yêu thích thôi nào, còn rất nhiều công cụ hấp dẫn khác tùy lựa chọn của mỗi người, tuy nhiên là một công cụ "xịn" nên sẽ có thời hạn nhưng yên tâm với tài khoản sinh viên thì gia hạn không tốn đồng nào đâu nhé!

Chúc bạn thành công!

#Jetbrains #WebStorm #suntechvietnam