HTML, CSS MySQL PHP

HTML, CSS và PHP là từ viết tắt của các ngôn ngữ mã hóa khác nhau được sử dụng để hiển thị các trang web trên internet. Mỗi cái có một mục đích và chức năng khác nhau và chúng phối hợp với nhau để cung cấp các trang web đẹp mắt với nội dung được cập nhật cho trình duyệt web của bạn

HTML là viết tắt của Hyper Text Markup Language, CSS cho Cascading Style Sheets, và PHP cho PHP Hypertext Preprocessor. (Vâng, từ viết tắt là đệ quy. Mọt máy tính thích làm những trò ngớ ngẩn như thế này như một trò đùa. )

Lời giải thích 10 giây. HTML là xương thịt của một trang web, xác định cấu trúc của nó. CSS là trang phục, cho phép các nhà thiết kế thực hiện các thay đổi trên toàn bộ trang web dễ dàng hơn trong khi PHP tập hợp từng phần của trang web và chuẩn bị cho bạn xem thỏa thích

Chắc chắn những lời giải thích về các từ viết tắt này đã giúp bạn hoàn toàn hiểu được những ngôn ngữ này được sử dụng để làm gì. Nhưng nếu bạn muốn biết thêm thông tin chi tiết (và tôi biết bạn cũng vậy), hãy tiếp tục đọc phần bên dưới

HTML

Chúng tôi sẽ bắt đầu với HTML, vì đó là cách web bắt đầu. Trước đây, các nhà thiết kế web cũ của chúng tôi chỉ có HTML cũ nhàm chán để tạo trang web. Đó là một khó khăn khốn khổ; . Nhưng tôi đang vượt lên chính mình

HTML = Ngôn ngữ đánh dấu siêu văn bản, nhưng điều đó có nghĩa là gì? . Văn bản đó là siêu? . Liên kết là những gì làm cho web được kết nối với nhau

Phần ML của HTML hoặc Ngôn ngữ đánh dấu đề cập đến cách ngôn ngữ được cấu trúc. với đánh dấu lên. Một tài liệu văn bản đơn giản được đánh dấu bằng các thẻ xác định vai trò của văn bản giữa các thẻ

Ví dụ. văn bản tiêu đề (như tiêu đề của blog này) thường được bao quanh bởi và các thẻ H1. Điều này cho phép trình duyệt của bạn biết rằng văn bản là một tiêu đề và con số cho biết mức độ nổi bật/tầm quan trọng của tiêu đề (với 1 là quan trọng nhất). Các thẻ cho trình duyệt web biết văn bản giữa các thẻ dùng để làm gì và ban đầu, trình duyệt sẽ hiển thị văn bản như thế nào. Đó là trước khi CSS

CSS

Cascading Style Sheets cho trình duyệt biết cách hiển thị các thẻ HTML. Các quy tắc kiểu này sẽ ghi đè các quy tắc hiển thị mặc định mà trình duyệt dành cho các thẻ HTML. Các biểu định kiểu xếp tầng ở chỗ có thể có một số quy tắc xung đột có thể được áp dụng cho một thẻ cụ thể nhưng các quy tắc được nhắm mục tiêu cụ thể nhất sẽ ghi đè các quy tắc được nhắm mục tiêu ít cụ thể hơn

Nhắm mục tiêu cụ thể? . Ngoài ra, bạn có thể chỉ định các lớp và ID cho các thẻ HTML cụ thể và sử dụng CSS để nhắm mục tiêu một thẻ cũng dựa trên các tiêu chí này

Về cơ bản, nhiều thứ từng được thực hiện trong HTML bằng hình ảnh và các thủ thuật kỳ lạ giờ đây có thể được thực hiện đơn giản hơn thông qua CSS, giúp tiết kiệm thời gian của nhà thiết kế và tăng tốc thời gian tải trang bằng cách giảm lượng dữ liệu cần tải xuống để trang hoạt động bình thường.

PHP

Vì vậy, HTML định dạng trang web và CSS xác định cách hiển thị định dạng đó. Nghe có vẻ như đó là tất cả những gì chúng ta cần để tạo một trang web đẹp, vậy PHP để làm gì? . PHP, như bạn nhớ lại, là viết tắt của PHP Hypertext Preprocessor và nó thực hiện đúng như tên gọi của nó. nó tiền xử lý siêu văn bản

Nhưng tiền xử lý siêu văn bản nghĩa là gì? . Nó có thể được sử dụng để lắp ráp một tài liệu HTML một cách nhanh chóng từ một số phần khác nhau, viết tất cả thành HTML hoặc CSS liền mạch và gửi nó tới trình duyệt web của bạn để hiển thị

PHP rất thuận tiện để tạo các mẫu trang cho một trang web, do đó nếu bạn muốn thay đổi một thành phần chung của trang web như tiêu đề hoặc điều hướng, bạn chỉ phải thay đổi một lần thay vì trên mọi trang của toàn bộ trang web. Điều này làm giảm đáng kể khả năng mắc lỗi hoặc bỏ sót phiên bản cần được cập nhật

Tóm lại là như vậy. HTML là ngôn ngữ lập trình cơ bản và nguyên bản dành cho các nhà thiết kế web trong khi CSS và PHP đã xuất hiện theo thời gian để cải thiện sự dễ dàng tạo trang web và tăng tốc độ của trang web. Tôi hy vọng điều này đã cung cấp nhiều thông tin cho bạn và không quá nhàm chán hay kỳ quặc

Bạn có câu hỏi nào khác về tiếp thị internet hoặc phát triển web không?

Gần đây tôi đã hoàn thành trang web đầu tiên của mình và trước đây tôi không có kiến ​​thức về phát triển web. Như trong hầu hết các công việc liên quan đến CS, internet là người bạn đồng hành thân thiết nhất của tôi. Trong kho lưu trữ này, tôi đã biên soạn một số tài nguyên hữu ích mà tôi tìm thấy trên mạng. Hãy nhớ rằng sẽ có rất nhiều 'google' để làm trên đường đi

Cụ thể hơn, kho lưu trữ này là tập hợp các tài nguyên như HTML, CSS (Bootstrap), PHP, MySQL, JavaScript. Tôi cũng sẽ cung cấp một số tài nguyên về cách xuất bản trang web bằng Amazon AWS và NameCheap

Đề cương

Ghi chú

Trước khi bạn bắt đầu, hãy tự làm quen với LAMP vs MEAN stacks là gì. Bài viết này rất hữu ích và có thể là một điểm khởi đầu tốt. Trong bài viết này tôi sẽ chỉ nói về LAMP (Linux, Apache, MySQL và PHP)

HTML

HTML là một ngôn ngữ đánh dấu được sử dụng để tạo các trang web. Cá nhân tôi sử dụng W3Schools để tra cứu nhanh cú pháp hoặc như một hướng dẫn tham khảo. Hướng dẫn tại W3School có cả ví dụ và trình chỉnh sửa nơi bạn có thể dùng thử

  • Tài liệu web MDN là tài liệu tham khảo HTML do Mozilla cung cấp
  • là một trang web nơi bạn có thể kiểm tra xem trình duyệt nào đó có hỗ trợ các thành phần CSS và HTML hay không
  • Bạn có thể tìm thấy sổ tay toàn diện hơn về HTML và CSS tại đây. Cá nhân tôi thấy nó hơi khó sử dụng và điều hướng xung quanh
  • Không giống như các ngôn ngữ kịch bản, nếu bạn gặp lỗi cú pháp thì không có gì chạy, ngôn ngữ đánh dấu sẽ chạy bất kể bạn có mắc lỗi trong tài liệu của mình hay không. Có một trang web nơi bạn có thể kiểm tra tính hợp lệ của đánh dấu HTML, XHTML, v.v.
  • Nếu bạn cần sử dụng một số ký tự như '&' hoặc '§', bạn sẽ cần đánh dấu chúng dựa trên giao thức nhất định. trang cung cấp tham chiếu thực thể ký tự

CSS

HTML là ngôn ngữ đánh dấu và Cascading Style Sheet là ngôn ngữ biểu định kiểu. CSS được sử dụng để trình bày HTML theo cách hấp dẫn và dễ tiếp thị hơn. Hãy xem xét nó theo cách này, nếu HTML là khung của trang web thì CSS là hình thức bên ngoài của trang web

  • Thủ thuật CSS là trang web nơi bạn có thể tìm thấy sách hướng dẫn tham khảo CSS, video hướng dẫn bạn cách thực hiện một số 'thủ thuật' nhất định và thậm chí có thư viện nơi bạn có thể duyệt qua một số ý tưởng
  • MDN Web Docs của Mozilla cũng có hướng dẫn về cách sử dụng CSS

Có nhiều framework front-end khác nhau. Một số ví dụ là Dựa trên, Nền tảng, CSS thuần túy và Bootstrap

Bootstrap là gì?

Nó là một khuôn khổ front-end được sử dụng để phát triển web. Như tôi đã nói trước đây, nếu HTML là khung của trang web, thì CSS là hình thức bên ngoài và Bootstrap là một công cụ được sử dụng để làm cho hình thức bên ngoài dễ dàng hơn. Khi tôi mới bắt đầu với Bootstrap, tôi đã xem hướng dẫn trên youtube này rất hữu ích

Bootstrap

  • Khung Bootstrap rất dễ sử dụng, nó được ghi lại đầy đủ và có rất nhiều tài nguyên trực tuyến có thể giúp bạn hầu hết mọi thứ
  • Ngoài ra, trên trang web của họ, bạn có thể tìm thấy rất nhiều ví dụ với mã nguồn

Thanh điều hướng Có lẽ điều đầu tiên bạn muốn trên trang web của mình là thanh điều hướng. Trên đó bạn có thể tìm thấy nhiều phiên bản khác nhau phù hợp với mục đích của bạn

Băng chuyền là một tính năng thú vị, dễ thực hiện trên trang nhất của bạn. Dưới đây là một số hướng dẫn hữu ích

  • tăng cường

Scroll Spy cho phép cập nhật liên kết trong thanh điều hướng dựa trên vị trí của bạn

  • trang mạng
  • W3School
  • Hướng dẫn chỉ ra cách tạo hiệu ứng scrollspy

Tài liệu bổ sung

Một số tài nguyên miễn phí bạn có thể sử dụng trực tuyến

  1. Các biểu tượng từ W3School
  2. Trong IconFinder, bạn có thể tìm thấy cả biểu tượng miễn phí và 'cao cấp'
  3. Hình ảnh chất lượng cao miễn phí có thể được tìm thấy trong Bapt. Chỉ cần chắc chắn rằng bạn cung cấp tín dụng cho nhiếp ảnh gia
  4. Bootstrap cũng có bạn có thể sử dụng, dễ dàng triển khai trên trang web của bạn. Ví dụ về cách sử dụng chúng có thể được tìm thấy trong W3Schools

PHP

  • Nếu bạn muốn sử dụng cơ sở dữ liệu trong trang web của mình, bạn sẽ phải sử dụng ngôn ngữ kịch bản. Nó có thể là JavaScript (hiện rất phổ biến), PHP hoặc một số ngôn ngữ kịch bản khác mà bạn thích
  • Như trong bất kỳ ngôn ngữ nào, bạn sẽ phải học cú pháp trước. Tôi thấy các hướng dẫn của W3School rất hữu ích. Nói chung, W3Schools cung cấp giải thích tốt và luôn đưa ra ví dụ
  • Ghi chú. Giả sử bạn đang làm việc trên chỉ mục của mình. trang html. Nếu bạn muốn sử dụng php trong chỉ mục của mình. trang html, bạn phải đổi tên chỉ mục của mình. trang html để lập chỉ mục. php. Mã PHP sẽ không hoạt động nếu bạn giữ chỉ mục. tên html

Nếu bạn đang sử dụng PHP, khả năng trang web của bạn cần các biểu mẫu là khá cao. Thông thường mỗi trang chỉ có 1 form và 1 nút gửi

  • Điều gì sẽ xảy ra nếu bạn cần nhiều hơn 1 nút gửi trong 1 biểu mẫu. Ví dụ: 1 nút gửi chịu trách nhiệm 'lưu' và nút thứ 2 chịu trách nhiệm 'xóa' trường nhập liệu. Theo dõi StackOverflow rất hữu ích để giải quyết vấn đề đã đề cập ở trên. Ngoài ra, hãy đọc chủ đề này thảo luận về vấn đề tương tự

  • Nếu bạn cần có nhiều hơn 1 biểu mẫu trong một trang web thì sao? . Bạn có thể tìm thêm trong diễn đàn này

  • Trong HTML và HTTP, mọi trang web được xử lý riêng. Nói cách khác, thông tin ở trang trước sẽ không liên quan đến trang tiếp theo. Tuy nhiên, nếu bạn cần chuyển biến từ trang này sang trang khác, bạn có thể sử dụng 3 phương pháp. Phiên, Cookie, Nhận/Đăng. Có thể tìm thấy nhiều hơn trong trang StackOverflow này

Thủ thuật Bạn cũng có thể tạo biểu mẫu HTML và làm cho nó ẩn trên trang web. Nhưng khi người dùng nhấn. Ví dụ, giả sử bạn có 3 trang web. Trang1, Trang2, Trang3. Và bạn cần chuyển thông tin từ Trang 1 sang Trang 3. Ngoài ra, bạn có các biểu mẫu HTML riêng biệt trên Trang 1 và Trang 2. Nói cách khác, thông tin từ Trang 1 được sử dụng trong Trang 2 và sau đó là Trang 3. Trong trường hợp này, bạn sẽ có biểu mẫu trên Trang 1 và Trang 2. Bí quyết là trong Trang 2, bạn sẽ có 'đầu vào' vô hình sẽ có các giá trị từ Trang 1. Vì vậy, khi người dùng nhấp vào nút Gửi trên Trang 2, họ sẽ chuyển thông tin từ Trang 1 và Trang 2 sang Trang 3

mysql

  • Cài đặt MySQL trên máy Mac của bạn. Video youtube này hướng dẫn cách cài đặt MySQL và thiết lập nó trên máy Mac của bạn
    • Đảm bảo MySQL đang chạy trên máy Mac của bạn. Nói cách khác, đi tới Tùy chọn hệ thống và ở dưới cùng, bạn sẽ thấy biểu tượng MySQL. Nhấp vào nó và đảm bảo rằng nó có chữ "Đang chạy" bằng chữ màu xanh lá cây
  • Bài viết này tổng hợp hầu hết các câu lệnh trong MySQL, có thể tham khảo trong trường hợp quên câu lệnh
  • W3School cũng cung cấp một số hướng dẫn về cách sử dụng MySQL với PHP
  • Nếu bạn chưa quen với MySQL và muốn giao diện người dùng dễ dàng, MySQL Workbench là GUI thân thiện với người dùng
  • Bạn cũng có thể đăng nhập vào MySQL của mình thông qua thiết bị đầu cuối
    • Trong loại dấu nhắc đầu cuối

      mysql -u root -p
      

      Các hệ thống sẽ hỏi mật khẩu của bạn

    • Sau khi đăng nhập, bạn có thể sử dụng các lệnh được cung cấp trong bài đăng này

  • Lưu ý (hầu hết các bạn có thể sẽ không cần). Khi tôi viết trang web của mình, tôi cần sử dụng ngôn ngữ cyrillic (tôi. e. tiếng Nga) trong Cơ sở dữ liệu MySQL của tôi. Hóa ra MySQL có cấu hình UTF-8 lạ. Do đó, nếu bạn muốn sử dụng ngôn ngữ tiếng Nga trong cơ sở dữ liệu của mình, bạn sẽ cần sửa đổi một chút mã mysql của mình
    • Đây là một bài viết tốt đã giúp tôi. Ngoài ra, đừng quên khởi động lại MySQL, vì chỉ khi đó các thay đổi mới có hiệu lực

Máy chủ web cục bộ

Có rất nhiều lần thử và sai liên quan đến việc tạo một trang web. Cho dù đó là đồ họa hay back-end, bạn cần liên tục kiểm tra xem mã bạn viết có thực sự hoạt động không. Khi bạn chỉ làm việc với HTML, CSS và JavaScript, việc mở. html là đủ để xem những gì bạn dự định làm việc. Tuy nhiên, nếu bạn muốn xem mã php và mysql bạn đã viết có hoạt động chính xác hay không, chỉ cần mở. tệp html sẽ không làm gì cả. Bạn sẽ cần máy chủ web cục bộ để kiểm tra mã của mình. Có lẽ có những khung tốt hơn cho phép bạn kiểm tra mã của mình, nhưng tôi đã sử dụng trình duyệt và XAMPP làm máy trạm chính của mình

  • Cài đặt XAMPP
  • Trên máy Mac của bạn, hãy đặt thư mục làm việc của bạn (i. e. thư mục chứa trang web của bạn) vào thư mục XAMPP
    • Để truy cập vào thư mục XAMPP, hãy vào Applications/XAMPP/htdocs/yourFolder
  • Bây giờ bạn có thể chạy mã từ trình duyệt của mình và xem mã php của bạn có đang làm những gì bạn muốn không
  • Ghi chú. Bây giờ, bạn phải cập nhật mã nguồn html và php trong. /htdocs/thư mục của bạn. Bây giờ nó là thư mục làm việc của bạn

PHP và MySQL

Khi bạn đã cài đặt MySQL và PHP trên máy cục bộ của mình, bạn có thể truy cập và kết nối với cơ sở dữ liệu của mình bằng mã PHP sau


  

Để kiểm tra xem kết nối có thành công hay không, mã nguồn mở nằm trong thư mục XAMPP/htdocs/yourFolder. Mở mã nguồn của bạn trong trình duyệt web và quan sát xem có bất kỳ câu lệnh printf nào bắt đầu bằng "Lỗi" không

Nếu kết nối thành công, bạn có thể yêu cầu truy vấn từ cơ sở dữ liệu của mình


Xuất bản trực tuyến

  1. Mua tên miền

    1. 1. Có rất nhiều trang web nơi bạn có thể chọn và mua tên miền. một số trong số họ là. GoDaddy, Google Domains hoặc NameCheap. Lưu ý rằng hướng dẫn tham khảo này giả định rằng bạn sẽ mua miền từ NameCheap

  2. Kết nối Miền của bạn với AWS Linux Instance của Amazon

    2. 1. Bạn có Phiên bản EC2 của Amazon không? . 2. Tuy nhiên, nếu bạn chưa thiết lập phiên bản EC2, hãy đọc tiếp

    2. 1. 1 Đầu tiên, tạo tài khoản Amazon AWS miễn phí

    2. 1. 2. Tạo máy ảo. Nói cách khác, tạo Phiên bản EC2 với các tham số bạn cần. Đây là một hướng dẫn được cung cấp bởi Amazon. Khi bạn tạo phiên bản, hệ thống sẽ cung cấp cho bạn. tập tin pem. Đó là khóa ví dụ của bạn. Hãy chắc chắn rằng bạn lưu nó ở một nơi an toàn, bởi vì hệ thống không lưu nó ở bất cứ đâu

    2. 1. 3. Nhấp vào 'Khởi chạy phiên bản' từ bảng điều khiển AWS của bạn

    2. 1. 4. Bạn có thể kết nối với phiên bản EC2 của mình từ thiết bị đầu cuối của máy cục bộ. Trong dấu nhắc lệnh gõ

    ssh -i NameOfYourKey.pem ubuntu@IPAddress
    

    Lưu ý rằng tôi thiết lập EC2 của mình không phải là Linux mà là Ubuntu. Tùy thuộc vào cách bạn thiết lập EC2, bạn sẽ có hệ điều hành khác nhau

    2. 1. 5. Khi bạn kết nối qua thiết bị đầu cuối của mình, bây giờ bạn cần cài đặt MySQL, PHP trên máy ảo của mình. Phần này giải thích cách cài đặt LAMP trên máy ảo của bạn

    2. 1. 6. Để kiểm tra xem mọi thứ đã được cài đặt đúng chưa, hãy mở trình duyệt web của bạn và gõ

    http://your_server_IP_address/info.php
    

    Trong trường hợp này, 'Địa chỉ IP máy chủ' tương ứng với 'IP công cộng IPv4' trên bảng điều khiển Phiên bản chạy AWS của bạn

    • Bảng điều khiển Phiên bản đang chạy AWS là. đăng nhập vào AWS của Amazon và chọn EC2 từ trang chính. Nhấp vào liên kết “Phiên bản đang chạy”, liên kết này sẽ ở đầu trang web. Bạn sẽ thấy danh sách tất cả các phiên bản EC2 của mình. Cuộn sang bên trái và bạn sẽ thấy IPv4 Public IP

2. 2. Hướng dẫn của Brian Carey là một tài nguyên toàn diện bao gồm các chủ đề như Route 53 và sẽ hướng dẫn bạn cách kết nối Phiên bản Linux với NameCheap. Một lần nữa, lưu ý rằng tôi đã thiết lập Ubuntu

  1. Bên trong máy ảo của bạn, đặt thư mục làm việc của bạn (i. e. thư mục chứa trang web của bạn) vào /var/www/html

  2. Cho nó một chút thời gian; . Khi bạn xuất bản trang web, có thể mất 24 giờ (mặc dù, thông thường, nó thay đổi từ 30 phút đến vài giờ)

Ghi chú

Kho lưu trữ này có nghĩa là một tập hợp các tài nguyên và hướng dẫn khác nhau từ trực tuyến. Tôi không sở hữu bất kỳ trang web và/hoặc hướng dẫn nào nêu trên

HTML CSS PHP MySQL là gì?

Mỗi cái có một mục đích và chức năng khác nhau và chúng phối hợp với nhau để cung cấp các trang web đẹp với nội dung cập nhật cho trình duyệt web của bạn. HTML là viết tắt của Ngôn ngữ đánh dấu siêu văn bản, CSS là Biểu định kiểu xếp tầng và PHP là Bộ tiền xử lý siêu văn bản PHP . (Vâng, từ viết tắt là đệ quy.

Làm cách nào để sử dụng HTML CSS và PHP cùng nhau?

Step 1: Firstly, we have to type the Html code in any text editor or open the existing Html file in the text editor in which we want to use the PHP. Step 2: Now, we have to place the cursor in any tag of the tag where we want to add the code of PHP. And, then we have to type the start and end tag of PHP.

Cách tạo trang đăng nhập HTML CSS và PHP và MySQL?

Bước 1- Tạo biểu mẫu đăng nhập HTML PHP. Để tạo một biểu mẫu đăng nhập, hãy làm theo các bước được đề cập bên dưới. .
Bước 2. Tạo mã CSS cho thiết kế trang web. .
Bước 3. Tạo bảng cơ sở dữ liệu bằng MySQL. .
Bước 4. Mở kết nối đến cơ sở dữ liệu MySQL. .
Bước 5 - Tạo phiên đăng xuất. .
Bước 6 - Tạo Mã cho Trang chủ

Làm cách nào để tạo một trang web bằng HTML CSS JavaScript và PHP MySQL?

Vì vậy, bạn cần cài đặt XAMPP để chạy mã của mình. .
Tải xuống trình cài đặt XAMPP. Chọn phiên bản tương thích với máy tính của bạn. .
Hãy bắt đầu mã hóa. Trước tiên, bạn sẽ cần một trình soạn thảo văn bản để tạo và chỉnh sửa chương trình của mình. .
Bây giờ, hãy kiểm tra liên kết. Bạn đã tạo thành công trang đầu tiên của mình. .
Cuối cùng, Bây giờ bạn có thể kiểm tra đầu ra