Sáng kiến kinh nghiệm THPT: Phát triển năng lực học lập trình cho học sinh qua các ứng dụng thực tế

Chia sẻ: _ _ | Ngày: | Loại File: PDF | Số trang:33

Thêm vào BST

Báo xấu

23
lượt xem 4
download

Download Vui lòng tải xuống để xem tài liệu đầy đủ

Đề tài "Phát triển năng lực học lập trình cho học sinh qua các ứng dụng thực tế" nhằm giúp giáo viên có thêm phương pháp giáo dục mới, nhằm phát triển năng lực của học sinh. Từ những bài tập dự án, giúp học sinh có được kỹ năng làm việc theo nhóm và kỹ năng lập trình, phân tích thiết kế hệ thống để hình thành thiết kế CSDL theo mô hình phổ biến hiện nay là CSDL quan hệ dạng bảng dữ liệu.

Chủ đề:

Bình luận(0) Đăng nhập để gửi bình luận!

Lưu

Nội dung Text: Sáng kiến kinh nghiệm THPT: Phát triển năng lực học lập trình cho học sinh qua các ứng dụng thực tế

SỞ GIÁO DỤC & ĐÀO TẠO NGHỆ AN TRƯỜNG THPT THANH CHƯƠNG I ……………………………… SÁNG KIẾN KINH NGHIỆM Đề tài: PHÁT TRIỂN NĂNG LỰC HỌC LẬP TRÌNH CHO HỌC SINH QUA CÁC ỨNG DỤNG THỰC TẾ ( TẠO WEBSITE DU LỊCH, DI TÍCH LỊCH SỬ, WEBSITE BÁN HÀNG, MODUL TRA CỨU TỪ ĐIỂN TIẾNG DÂN TỘC THÁI HUYỆN THANH CHƯƠNG ) Người thực hiện : NGUYỄN VĂN HÙNG Tổ : TOÁN – TIN Điện thoại: 0912.533.519 NĂM HỌC: 2021 – 2022 0
PHẦN I. ĐẶT VẤN ĐỀ 1. Lí do chọn đề tài Với tình hình đại dịch Covid đang diễn ra rất phức tạp, chính phủ có nhiều giải pháp chuyển đổi số cho nhiều lĩnh vực, giáo dục cũng không ngoại lệ bởi tính cấp thiết của nó. Các ứng dụng dạy học online, giao dịch ví điện tử, học mọi lúc mọi nơi … Trên tinh thần đó, bản thân tôi đã từng hoàn thành khoá học lập trình website với ngôn ngữ PHP của Microsoft tại Nhất Nghệ năm 2013. Bản thân cũng hoàn thành nhiều ứng ụng thực tế về website, hiện nay 3 mã nguồn có thể lựu chọn là wordpress, jomla, nukeviet nhận thấy cần hướng dẫn cho học sinh tạo ra các ứng dụng thực tế trong mùa dịch với mục đích tạo động lực học lập trình cho học sinh khối 11 và hệ quản trị CSDL khối 12. Mã nguồn phù hợp tôi chọn Nukeviet bởi đây là mã nguồn được cộng đồng người việt tạo ra dựa trên mã nguồn phpnuke rất dễ dùng cho người mới bắt đầu làm quen với thương mại điện tử, tính bảo mật và các tuỳ biến rất linh hoạt dễ dàng phân quyền người sử dụng được bộ giáo dục và đào tạo khuyên dùng trong thông tư 08/2010/TT-BGDĐT, bộ thông tin và truyền thông quy định ưu tiên dùng trong các cơ quan, tổ chức nhà nước tại thông tư số 20/2014 TT- BTTTT, được trao giải nhân tài Đất Việt năm 2011. 2. Mục đích nghiên cứu Đề tài giúp giáo viên có thêm phương pháp giáo dục mới, nhằm phát triển năng lực của học sinh. Từ những bài tập dự án, giúp học sinh có được kỹ năng làm việc theo nhóm và kỹ năng lập trình, phân tích thiết kế hệ thống để hình thành thiết kế CSDL theo mô hình phổ biến hiện nay là CSDL quan hệ dạng bảng dữ liệu. 3. Nhiệm vụ và phạm vi nghiên cứu 3.1 Nhiệm vụ nghiên cứu Sử dụng phương pháp dạy học theo dự án, học sinh hoạt động trong và ngoài giờ học. 3.2 Phạm vi nghiên cứu Đề tài được nghiên cứu trong quá trình dạy học tại trường THPT Thanh Chương 1 và trên địa bàn huyện Thanh Chương. 4. Đối tượng nghiên cứu 1
- Sách giáo khoa tin học 11, 12. - Chuẩn kiến thức kỹ năng môn Tin học trung học phổ thông _ NXB Giáo dục. - Tài liệu về thiết kế tại trang http://nukeviet.vn. - Tài liệu tập huấn về dạy học theo chương trình mới. - Tài liệu về PHP, MySQL, Bootstrap, HTML, Xtemplate, CSS, JavaScript, Photoshop - Học sinh khối 11,12 năm học 2021-2022. 5. Phương pháp nghiên cứu - Phương pháp sưu tầm, tổng hợp: Tổng hợp, tham khảo từ các dữ liệu ở huyện Thanh Chương( Từ điển dân tộc Thái, Địa danh lịch sử, Các nhà hàng, khách sạn, Đặc sản tại Thanh Chương). - Phương pháp thực nghiệm: Làm dự án thực tế tạo website thương mại điện tử về Thanh Chương với tên miền http://thanhchuong.net PHẦN II. NỘI DUNG 1. THỰC TRẠNG TRƯỚC KHI THỰC HIỆN CÁC GIẢI PHÁP SÁNG KIẾN Trong thời đại chuyển đổi số môn tin học là môn học quan trọng nhằm giúp học sinh giải quyết các vấn đề thực tế hiệu quả. Nhưng hiện nay môn tin chưa đưa vào thi tốt nghiệp và Đại học nên nhiều học sinh và phụ huynh không quan tâm và không thấy được tầm quan trọng của môn học. Các chương trình lập trình chưa giải quyết được các công việc cụ thể mang tính ứng dụng. Bên cạnh đó thì hầu hết học sinh chưa có kiến thức về HTML, CSS, JAVACRIP, PHOTOSHOP, PHP, CSDL MySQL nên để tạo ra trang thương mại điện tử http://thanhchuong.net không hề dễ dàng, bắt buộc giáo viên phải tư duy nên chọn mã nguồn mở nào phù hợp đáp ứng được giải quyết vấn đề. 2. NỘI DUNG, PHƯƠNG PHÁP THỰC HIỆN SÁNG KIẾN Chọn mã nguồn Nukeviet, hướng dẫn học sinh cài đặt trên môi trường Localhost qua phần mềm XAMPP và thực thi các dự án thương mại điện tử trên PC hoặc Laptop với hệ điều hành Windows 10 64bit. 2
2.1.1 : Vào links trang chủ nukeviet để download mã nguồn viết web Link : https://nukeviet.vn/vi/download/ma-nguon/NukeViet-4-4-04.html 2.1.2. XAMPP là một phần mềm cho phép giả lập môi trường server hosting ngay trên máy tính của bạn, cho phép bạn chạy demo website mà không cần phải mua hosting. Links : https://www.apachefriends.org/download.html chọn bản 8.1.4 / PHP 8.1.4. 2.1.3. Cài đặt Xampp sau khi đã download 2.1.4.Tạo CSDL để cài đặt Nukeviet - Bật Start apache và MySQL như hình sau - Chọn Admin ở nhãn MySQL để tạo CSDL hộp thoại localhost / 127.0.0.1 | phpMyAdmin 5.1.3 xuất hiện chọn new, tiếp theo đánh tên CSDL cần 3
tạo vào ô Database name : đánh tên CSDL cần tạo thanhchuong và chọn Create như hộp thoại sau : 2.1.5.Cài đặt website với mã nguồn nukeviet 4.4.04 khi đã có CSDL rỗng thanhchuong.sql vừa tạo : - Sau khi download mã nguồn nukeviet 4.4.04 ở trang chủ nukeviet.vn hướng dẫn học sinh cài như sau : + Giải nén và copy mã nguồn vào thư mục c:\xampp\htdocs và đổi tên thư mục thành thanhchuong. Như hình sau : + Vào trình duyệt web google chomre gõ http://localhost/thanhchuong quá trình cài đặt đang diễn ra như hình sau : 4
+ Chọn ngôn ngữ cài đặt tiếng việt rồi chọn next để tiến hành quá trình cài đặt hộp thoại xuất hiện như sau : 5
+ Chọn bước kế tiếp để tiến hành cài đặt hộp thoại xuất hiện như sau : + Chọn bước kế tiếp để tiến hành cài đặt hộp thoại xuất hiện như sau : 6
+ Bước tiếp theo cấu hình CSDL : + Chọn thực hiện để kết nối CSDL và đổ dữ liệu website vào CSDL đã tạo thanhchuong.sql, username root( không đặt pass vì cài Xampp ở PC) hộp thoại xuất hiện như sau : * Gõ tên site: thanhchuong * Tài khoản: admin( để vào phần backend của web – phần quản trị web) 7
* Email: * Mật khẩu: mật khẩu để vào phần quản trị web * Chọn câu hỏi bảo mật để phục hồi mật khẩu nếu sau này quên Chọn thực hiện để hoàn thành cài đặt, hộp thoại xuất hiện có nghĩa đã cài đặt thành công. + Chọn xem trang hoặc đăng nhập vào phần quản trị để xem kết quả * Chọn xem trang chủ giao diện như sau : 8
* Chọn đăng nhập quản trị theo link : http://localhost/thanhchuong/admin Qua bước 5 học sinh đã hình dung ra website sẽ gồm 2 phần * FrontEnd : Là giao diện trang web để tương tác với người dùng * BackEnd : Là giao diện quản trị web để người quản trị đưa dữ liệu, quản trị phân quyền cho website( mà người dùng không nhìn thấy) 2.1.6 . Giới thiệu các chức năng có sẵn trong nukeviet và cách tuỳ biến giao diện, cài modul trên ý tưởng của học sinh tham khảo các website hiện có trên internet. Với giao diện PC trang http://thanhchuong.net học sinh thiết kế như sau( vẽ bằng phần mềm Paint hoặc Photoshop – ưu tiên Photoshop) : 9
Với thiết bị khác đã có Boottrap bắt giao diện hiển thị Vậy website http://thanhchuong.net sẽ gồm các chức năng : * Trang chủ gồm các menu : Đặc sản : Giới thiệu về các dịch vụ đặc sản của thanh chương như : Nhút Thanh Chương địa chỉ uy tín làm sản phẩm, Gà Thanh Chương ….. Dịch vụ : Giới thiệu các khách sạn, nhà nghỉ uy tín trên địa bàn ….. Chợ mua bán : Trang bán hàng trao đổi các sản phẩm cần mua bán trên địa bàn và mọi miền tổ quốc, có chức năng phân quyền cho các thành viên đăng bài. Từ điển : Giới thiệu và tra từ điển tiếng dân tộc thái sinh sống Thanh Chương hơn 1186 từ. Các địa danh : Giới thiệu các địa danh nổi tiếng và các khu di tích lịch sử tại Thanh Chương( như đền Bạch Mã, Đảo Chè ….). - Giới thiệu cấu trúc thư mục và tệp của nukeviet + Gồm các thư mục và tệp như hình sau : 10
- Giới thiệu cho học sinh cách sử dụng các thư mục cơ bản để tạo ứng dụng web với kiến thức đã có trên nền tảng lập trình C++ và hệ quản trị CSDL Acess. * Thứ nhất : Thư mục liên quan đến chỉnh sửa giao diện với kiến thức cơ bản HTML, CSS, Bootstrap, Xtemplate, Photoshop đó là thư mục thems. Thư mục themes của nukeviet có cấu trúc như sau : Gồm 3 thư mục với 3 giao diện + admin_default : Giao diện quản trị( BackEnd) + default : Giao diện bên ngoài web( FrontEnd) + mobile_default : Giao diện mobile Hướng dẫn học sinh tuỳ biến với giao diện FrontEnd với thư mục quản lý là default có cấu trúc thư mục như sau : 11
*** Lưu ý với học sinh : Trước khi chỉnh sửa giao diện để không ảnh hướng sau này nâng cấp hệ thống nukeviet ta cần copy them default thành 1 them mới và đổi tên them cần chỉnh sửa( ở đây ta copy them default và đổi tên thành them mới có tên thanhchuong) Như vậy sau thực hiện công việc trên thư mục thems nukeviet như sau : Như vậy mọi tuỳ biến với giao diện ta sẽ tuỳ biến ở thư mục thems có tên thanhchuong gồm cấu trúc như sau : File đầu tiên các em cần hiểu được đó là file them.php gồm các hàm để thực hiện gọi các file tạo nên giao diện như css, bootstrap, javacrip, các modul … - Do ban đầu mới làm web nên chỉ chú tâm các thư mục chỉnh giao diện * Liên quan đến bố cục trình bày trong thư mục layout có cấu trúc như sau : 12
* Thiết kế giao diện từ đầu nên hướng dẫn học sinh quan tâm đến layout có tên layout.main.tpl có cấu trúc như sau : * Tiếp đến hướng dẫn học sinh đăng nhập BackEnd để thiết lập giao diện như đã thiết kế từ đầu. Đăng nhập vào BackEnd như sau : http://localhost/thanhchuong/admin/ 13
Nhập tên truy cập : admin Mật khâu : nhập mật khẩu đã đặt Xuất hiện giao diện như sau : * Chọn giao diện Thanh Chuong đã thiết kế và chọn quản lý giao diện rồi chọn thiết lập layout chọn layout main và chọn lưu tất cả thay đổi như hình sau : 14
2.1.7. Chỉnh sửa kéo thả Block, CSS, cài modul Slide ảnh và modul Shop . - Tuỳ biến các khối block dùng chức năng kéo thả có sẵn ở nukeviet 15
- Chính sửa menu mở style.css trong thư mục them của thanhchuong có cấu trúc như sau( mở bằng notepad++) Chọn #menusite .navbar-default { background-color: #428BCA; border-bottom-color: #428BCA; border-bottom-width: 1px; border-bottom-style: solid; border-top-left-radius: 5px; border-top-right-radius: 5px; z-index: 1; } 16
Để thay đổi màu nền, border của menu, với kiến thức CSS cơ bản đã có hướng dẫn học sinh lấy mã màu bằng Photoshop để tuỳ biến giao diện linh hoạt và kiểm tra website chạy trên mọi thiết bị bằng nháy chuột phải vào vùng muốn thay đổi chọn kiểm tra rồi chọn kiểu hiển thị. - Tiếp theo hướng dẫn học sinh cài modul Shop( để tạo trang bán hàng) và modul slide ảnh như sau : + Vào links tại trang Nukeviet để Download : * Modul Shop : https://nukeviet.vn/vi/store/modules/shops * Modul : Slide ảnh : https://nukeviet.vn/vi/store/modules/silder + Sau khi Download xong hướng dẫn học sinh vào cài đặt 2 modul này như sau : * Đăng nhập vào quản trị * Chọn Menu Mở rộng và chọn cài đặt gói ứng dụng để cài đặt * Cài đặt thành công như hình sau(có thêm 2 modul shop và slider) : 17
Sau khi cài thành công modul Shop vào menu chợ mua bán ở trang chủ có giao diện như sau( gồm chọn sản phẩm, giỏ hàng, đặt hàng …..) : 18
- Như vậy vấn đề về thiết kế giao diện cơ bản đã được thực thi, khi có giao diện như ý tưởng thiết kế cần hướng dẫn học sinh đăng bài ở phần quản trị và dữ liệu được lấy từ rất nhiều bảng CSDL như sau : Nhìn vào 128 bảng dữ liệu để hình thành một trang thương mại điện tử với đầy đủ chức năng thì việc thiết kế CSDL rất quan trọng. Từ đó học sinh thấy tầm quan trọng của CSDL quan hệ. Các em liên hệ với bài học ‘‘Liên kết giữa các bảng bài 7 trong SGK tin học trang 57 lớp 12’’( hiểu hơn về khoá chính trong bảng). 19