Nguy hiểm cực cơ bản nhưng ít đề phòng khi lựa chọn element để định dạng CSS

Chúng ta đã biết #id trong CSS là để chỉ đích danh một element, nó giống như số chứng minh thư của bạn, mỗi người xài một cái, không có hai người nào có chung số CMT. Còn .class thì khác, nó để nhóm những element có đặc điểm chung để xử lý luôn một chùm. Nó giống như sở thích của bạn. ...

Tác giả: Hoàng Hải Đăng viết 21:26 ngày 11/08/2018

Load image cho các loại màn hình khác nhau

Bạn muốn load 3 image khác nhau (Ý mình ở đây là dùng <img> tag không phải background nhé) cho 3 loại màn hình khác nhau (small, medium, large). Bạn sẽ làm thế nào? Mình thấy có một số bạn sử dụng show, hide element. Theo mình đó là cách làm không tốt đối với Responsive. Mình sẽ hướng dẫn ...

Tác giả: Bùi Văn Nam viết 21:25 ngày 11/08/2018

Tuyển tập 10 mẫu button ấn tượng trên Codepen

Lang thang thấy một số button rất đẹp trên Codepen nên tổng hợp lại. Các bạn click thẳng vào link tiêu đề để đến codepen nhé. ...

Tác giả: Hoàng Hải Đăng viết 21:25 ngày 11/08/2018

Thêm vào authentication cho Lotus app

Chú thích : Đây là bản dịch tiếng Việt của bài viết gốc của tôi. Nếu bạn muốn xem bản tiếng Anh, xin hãy trỏ tới URL http://ruby-journal.com/lotusrb/how-to-add-basic-authentication-into-lotus-app/ Lời mở Lotus Framework là một Ruby Web Framework mới với chú trọng vào cấu trúc tách rời với ...

Tác giả: Hoàng Hải Đăng viết 21:25 ngày 11/08/2018

Hiểu lầm tai hại của căn dọc (vertical-align) trong CSS

Khi người ta dùng nó để căn chiều dọc của block element , ví dụ một div , 1 ảnh... và thấy nó không có tác dụng. Bởi vì nó không sinh ra để căn chiều dọc của div, chỉ dùng để căn dọc inline element , ví dụ như 1 dòng chữ . 1 hàng ngang ảnh Tức là chỉ để căn dọc cho những ...

Tác giả: Hoàng Hải Đăng viết 21:25 ngày 11/08/2018

Viết component CSS (phần 1)

Bạn nhìn hình dưới đây, nếu app của bạn xuất hiện nhiều khối block-grid thế này thì mình nghĩ bạn nên viết nó thành 1 component CSS. Trong phần này mình có sử dụng kiến thức về sass, nên chỗ nào các bạn không biết thì vào link này để xem, ngoài ra mình cũng sử dụng một số mixin mặc định là có sẵn, ...

Tác giả: Trịnh Tiến Mạnh viết 21:25 ngày 11/08/2018

Implement Tam giác ma thuật của Amazon

Tuần này mình tham gia vào nhóm hardcore, là một nhóm nghiên cứu có mục tiêu là tìm hiểu chuyên sâu về các vấn đề công nghệ, các bạn quan tâm có thể tham khảo rule của nhóm tại đây. Mỗi tuần các thành viên sẽ pick một chủ đề và cuối tuần phải có được một bài viết tổng hợp lại những gì mình tìm hiểu ...

Tác giả: Tạ Quốc Bảo viết 21:24 ngày 11/08/2018

Tạo list icon cảm xúc facebook chỉ với html/css !

Intro Series khởi tạo list icon cảm xúc của Facebook Thường thì chúng ta hay sử dụng các icon cảm xúc của facebook và nghĩ rằng có lẽ nó viết bằng javascript, thì thật ra cũng có javascript vào chổ đó nhưng ít thôi. Còn ở series này chúng ta sẽ đi tìm hiểu việc tạo ra list icon này chỉ ...

Tác giả: Bùi Văn Nam viết 21:24 ngày 11/08/2018

Sự khác biệt giữa (<< & +=) của việc nối chuỗi trong String

Nhìn ví dụ dưới đây: Nối chuỗi với += first_name = "Paul" name = first_name last_name = "Brian" name += last_name Bây giờ mình kiểm tra: name ==> nó trả về kết quả PaulBrian first_name ==> nó trả về kết quả Paul Nối chuỗi với << first_name = ...

Tác giả: Hoàng Hải Đăng viết 21:24 ngày 11/08/2018

Ứng dụng code review trong quá trình phát triển dự án

Áp dụng code review trong quá trình phát triển dự án sẽ mang lại lợi ích to lớn cho nhóm lập trình cũng như cho từng thành viên trong nhóm. Bài viết này sẽ giới thiệu về: Code review là gì ? Lợi ích cũng như khó khăn khi áp dụng code review. Những cách làm cho việc áp dụng code review ...

Tác giả: Bùi Văn Nam viết 21:24 ngày 11/08/2018

Các thủ đoạn cơ bản để dàn bố cục trang với chỉ CSS (flexbox và grid)

Trước đây việc dàn bố cục trang ( layout ) chủ yếu dựa vào những công cụ thô sơ thời đồ đá, ví dụ để cho 2 đoạn văn ở 2 bên của trang thì người ta sẽ vẽ 1 cái bảng table gồm 1 hàng 2 ô rồi nhét chữ vào các ô. Để cho một thành phần trong trang ( element ) dạt vào góc bên trái người ta dùng ...

Tác giả: Tạ Quốc Bảo viết 21:24 ngày 11/08/2018

CSS: justify menu items

Đặt vấn đề Đây là mẹo khi style một menu có thiết kế trải đều hết chiều rộng container mà số lượng item không cố định. Kiểu như: --| Menu 1 - Menu 2 - Menu 3 |-- Menu 1 nằm sát bên trái Menu 2 ở giữa Menu 3 nằm sát bên phải Menu phải chiếm trọn chiều rộng của container. Mẹo ...

Tác giả: Bùi Văn Nam viết 21:23 ngày 11/08/2018

Center CSS (Flex)

Trên diễn đàn đã có nhiều bài hướng dẫn CSS nhưng mình thấy vẫn thiếu một cách quan trọng đó là dùng flex. Vậy nên mình sẽ đưa ra vài ví dụ để các bạn hình dung cách dùng. À mà quên mọi người nếu có thời gian vào vote giùm mình xem bao nhiêu coder còn support IE <11 vì hầu như chỉ có mỗi thằng ...

Tác giả: Tạ Quốc Bảo viết 21:23 ngày 11/08/2018

Cài đặt Ruby on Rails trên Mac OS

Cài đặt Homebrew Đầu tiên chúng ta cần phải cài đặt Homebrew. Homebrew cho phép chúng ta cài đặt và biên dịch các gói phần mềm dễ dàng hơn từ nguồn. Dòng lệnh cài đặt Homebrew rất đơn giản. Trong quá trình cài đặt nếu máy tính yêu cầu cài thêm XCode CommandLine Tools thì các bạn hãy chọn ...

Tác giả: Bùi Văn Nam viết 21:23 ngày 11/08/2018

Sự khác nhau của == , ===, eql?, equal?

==, ===, eql?, equal? Những cái này đều để so sánh vậy nó khác nhau cái gì nhỉ? Mình sẽ giải thích ở đây, theo cách hiểu của mình không trích dẫn từ nguồn nào hết. Vì vậy nếu có gì không đúng mọi người góp ý cho mình với nha. 1) == Kiểm tra cùng giá trị hay không 2) === Nó cũng ...

Tác giả: Tạ Quốc Bảo viết 21:23 ngày 11/08/2018

Cách tạo 1 Hybird App sử dụng HTML, CSS, JS

Có bao giờ bạn có suy nghĩ là sẽ cho ra đời 1 sản phẩm app sử dụng những ngôn ngữ của web (HTML, CSS, JS) chưa. Dùng ngôn ngữ của web để xây dựng nên 1 mobile app --> cái này gọi là Hybrid app ( nôm na là giao thoa giữa mobile web app và native app) Hiện nay thì có nhiều framework hỗ trợ cho ...

Tác giả: Tạ Quốc Bảo viết 21:22 ngày 11/08/2018

Có thể bạn biết rồi: CSS Arrow

Mình xin tiếp tục series bài viết "Có thể bạn biết rồi" , lần này mình sẽ lại nói về một vấn đề được nhiều người biết tới nhưng mình nghĩ ít ai hiểu rõ nguyên lý đằng sau nó, đó là CSS Arrow Nếu bạn chưa biết, thì CSS Arrow là một kĩ thuật giúp tạo ra một hình tam giác/mũi tên đính vào ...

Tác giả: Bùi Văn Nam viết 21:22 ngày 11/08/2018

Bài học đau đớn khi chập chững CSS + Kinh hoàng bài tập Tribute Page trên freecodecamp

Bài này không nhằm chê freecodecamp, thậm chí còn khen nhé :v Trong bài có sử dụng sự trợ giúp của các bạn Hồ Xuân Diễn, Robin Huy, Anh Nguyễn, Da Peng, Nguyễn Quốc Đại. (no particular order) 1.1 Kinh hoàng thứ nhất, Challenge này có vẻ đến quá đột ngột, người học mới chỉ được học qua ...

Tác giả: Bùi Văn Nam viết 21:22 ngày 11/08/2018

Cơ bản ngôn ngữ Crystal cho dân Ruby - Phần 1

Không thể phủ nhận là trong 5 năm đổ lại đây ngôn ngữ Ruby với cú pháp dễ học, cộng đồng và thư viện đồ sộ đã giúp nó lên ngôi trong mảng ứng dụng web. Tôi cũng mong là Ruby có thể giải quyết hết mọi thứ một cách nhanh và hiệu quả nhưng tiếc là Ruby không phù hợp để giải quyết các tác vụ đòi ...

Tác giả: Trịnh Tiến Mạnh viết 21:22 ngày 11/08/2018

Viết trình download có thanh tiến trình với ruby

Khi làm việc với Ruby và Rails, có lẽ không ít lần các bạn đã gặp các tác vụ download file về server của mình. Ruby hỗ trợ nhiều công cụ download khác nhau, từ đơn giản đến phức tạp, như Net::HTTP, OpenURI hay Mechanize, ... Tuy nhiên, các thư viện này không có sẵn chức năng hiển thị tiến trình ...

Tác giả: Trịnh Tiến Mạnh viết 21:21 ngày 11/08/2018