Một cải tiến với trang amlich.app mà mình dự định từ lâu, lấy ý tưởng từ trang wttr.in đó là hiển thị thông tin Âm Lịch ngay trên cửa sổ terminal. Nay nhờ có thằng đệ Claude Code và gói Copilot Pro Github tài trợ cho open source developer, mình đã xong nốt món nợ tech này. Tính năng rất đơn giản: Ngay trong cửa sổ terminal, chỉ cần gõ $ curl -L amlich.app # hoặc $ curl https://amlich.app thì thông…
Tôi đã “vibe code” browser extension: Tra cứu Đơn Vị Hành Chính 🇻🇳 . Đây là một side project xuất phát từ nhu cầu cá nhân mà mình nghĩ nhiều người cũng sẽ gặp phải: việc sử dụng tên phường xã mới đã xuất hiện sâu rộng trên các văn bản, mẫu đơn, tin tức báo chí… nhưng chúng vẫn quá mới và lạ lẫm đối với những người đã lớn lên cùng với những cái tên phường, tên quận quen thuộc. Đã có một vài công…
This blog is getting quite some dust. It’s been a while and I was too busy with daywork, technical research and especially a family with 2 kids. I regreted a little bit that I should have kept a habit of writing. Anyhow, here I am, at the end of of 2023. I jotting down my recap of 2023 as a chance to look back and appreciate what I have achieved and also to restart my writing habit. Professional…
Despite the title, this post is not intended as a generic guide like this one for the official Ubuntu GNOME . It is more of personal notes from my tweaks to become as productive on Ubuntu MATE as compared with macOS on the same MacBook Air. Therefore it is strongly opinionated from someone who has been using macOS on MacBook for a long time. Nevertheless, if you’re interested in using Ubuntu MATE…
Đôi điều về hai bảng mã Unicode tiếng Việt Chắc hẳn khi dùng các công cụ gõ văn bản tiếng Việt (TV), bạn đã từng nghe qua hai bộ mã TV Unicode: dựng sẵn và tổ hợp . Để hiểu rõ hơn chúng ta hãy cùng xem xét ký tự TV có dấu đơn giản: “Ạ” . Để mã hóa ký tự này, với Unicode dựng sẵn, chúng ta dùng một ký tự có mã Unicode U+1EA0 với tên mô tả tiếng Anh: “LATIN CAPITAL LETTER A WITH DOT BELOW”. Cả chữ A…
Trailing comma là gì? Tại sao nó từng là lỗi trong JavaScript? Trailing comma (dấu phẩy đuôi, dấu phẩy cuối) là việc để dư một dấu phẩy sau phần tử cuối cùng ở cuối một danh sách. (có thể là phần tử trong Array literal, property trong Object literal, tham số của hàm…). Ví dụ: // trailing comma trong Array literal var categories = [ 'men' , 'women' , 'accessories' , ] ; // trailing comma trong…
This will be a living reference blog post that I’ll keep updating. When I started my software engineering career, I was fully immerged with GUI and mouse pointers by the OS and the tooling I used. With irritation at first, I had to self-taught my terminal skills because some of the tasks demanded. However, the more I advanced in my career, the more I see how powerful and convenient CLI (command…
Lấy cảm hứng từ trang blog mới của Dan Abramov’s Overreacted.io và từ trang the Old New Thing mà chính blog của Dan lấy ý tưởng , để mở đầu cho những bài viết của năm 2019, tôi sẽ viết nhiều hơn về những “câu chuyện mới” từ những điều quen thuộc , những câu chuyện “tiểu tiết” nhưng thú vị về những thứ mà lập trình viên vẫn gặp hằng ngày, hay những ngóc ngách của kỹ thuật mà chúng ta vẫn thường…
Tóm tắt phần 1 : Bạn đã cài các phần mềm cần thiết để chạy app: NodeJS, MongoDB, Nginx, Git. App deploy bằng source từ Git host, và clone về tại /apps/my-node-app App đã được build và chạy tại port 3000 của server Hạn chế quyền truy cập của app Đây là bước không bắt buộc, tuy nhiên tôi khuyến cáo không nên bỏ qua, nhất là bạn đang truy cập vào VPS bằng tài khoản root. Chúng ta sẽ tạo một Linux…
If you are a long time MacBook (Air) user and recently switch to Linux, I bet one of the things you’ll miss most is the multi-touch touchpad. As I have blogged earlier that I decided to dual boot Ubuntu on this MacBook Air, at first, I also struggled to find the best setup for the touchpad to retain my productivity while not having to rely much on mouse. In this post, I’m detailing my touchpad…
I have been using a MacBook Air for both personal use and work since 2012. Apple’s hardware back then was top notch and reliable. When I did a feature and price comparison between a MacBook Air and other ultrabook offers, MacBook Air can easily rise up to the number one choice for a laptop that is portable, well-built and powerful enough at a reasonable price. Fast forward to 2018. Apple is not…
Tizonia là một phần mềm trên Linux cho phép chơi nhạc online từ Youtube, Spotify, Google Music, SoundCloud bằng… dòng lệnh. Lý do số một mình thích là nó chơi nhạc từ Youtube cực nhẹ vì không cần video và giao diện. Cài đặt Để cài đặt, bạn có thể tìm cài trong Software của Ubuntu (snap package) hoặc thông qua gói .deb với dòng lệnh: # Cho Debian/Ubuntu/Raspbian curl -kL…
Searching the web for a Jekyll / Liquid template helper that show “read time” of a post without plugins (so that it’ll work for GitHub Page) will probably land you at this post by Carlos Alexandro Becker. I also tried the solution of that post which I’ll quote it here (assuming 180 word-per-minute ): < span class = " reading-time " title = " Estimated read time " > {% assign words = content |…
I’m a Mac owner but also a Linux enthusiast and currently dual boot macOS and Linux. That’s why when I learned about new dynamic wallpaper feature of macOS Mojave, and recalled Ubuntu / Linux has a similar feature (note built-in) called wallpaper slideshow , I realized “Hey why not recreate the dynamic Mojave sand dune backgrounds on Linux with each image reflect the right moment of the day?”. So…
logo không chính thức của PWA P rogressive Web App (PWA) là một dạng ứng dụng web (web app) mới đang thu hút rất nhiều sự quan tâm từ các nhà phát triển web khắp thế giới đặc biệt là các doanh nghiệp hoạt động trực tuyến, tuy nhiên nó vẫn còn khá mới mẻ tại Việt Nam. Đã có nhiều bài viết liên quan đến PWA dành cho lập trình viên , cho nên trong bài viết này tôi sẽ cố gắng giải thích PWA để người…
Giới Thiệu NodeJS tuy phát triển mạnh mẽ những năm gần đây nhưng tại Việt Nam vẫn còn ít lựa chọn để triển khai (deploy) lên Internet cho công chúng. Các dịch vụ “app engine” cho NodeJS của nước ngoài như Heroku , Nodejitsu , now.sh … khó tiếp cận cho developer ở Việt Nam. Ngoài ra các dịch vụ trên còn nhiều hạn chế chẳng hạn: chưa có data center đặt tại Việt Nam, không kèm giải pháp database hoặc…
Cập nhật 2020-03-01: Bài viết này mình viết cũng đã lâu nhưng nó vẫn có lượt view cao trên trang blog này, nên mình quyết định bổ sung thêm một số bộ font code đẹp mới vào đây thay vì viết bài khác. Các bộ font mình bổ sung ở cuối bài. Bạn có biết trình soạn code của mình đang dùng font chữ gì không? Ít người quan tâm đến điều này nhưng việc lựa chọn font chữ cho code editor cũng ảnh hưởng ít…
Bài viết này được dịch một phần từ bài viết BEM 101 của CSS Tricks cùng với một số ý kiến và giải thích của cá nhân. Ký pháp BEM là gì BEM viết tắt của Blocks, Elements, Modifiers, là một phương pháp đặt tên class cho HTML và CSS. Được phát triển tại Yandex giúp lập trình viên hiểu rõ hơn mối quan hệ giữa HTML và CSS trong dự án front end. Ví dụ sau đây sẽ minh hoạ cách sử dụng ký pháp BEM: /* Một…
I have migrated my blog from Blogger to GitHub Pages. I am so far happy with it. Why The Change? My ultimate motivation of this move is the frustration of maintaining a long post’s format and hierarchy across multiple platforms and editors. The blog post needed reviewing and editing from different people, so I used Google Doc as the collaborating tool. But its rich format didn’t play nice with…
Image courtesy of mrichatham.com Recently, I am annoyed with some people thinking they can use their education and training to overcome lack of experience, or in other words, claiming that knowledge can replace experience. Though it has been said before , I want to express it again in my own thoughts and from my own experience (not a pun): Knowledge can be trained. Experience cannot. Knowledge can…
Mức kỹ năng tối thiểu (baseline) là gì? Là hệ thống kỹ năng và kiến thức tối thiểu của một nhân viên kỹ thuật cần có để có làm việc trong nhóm một cách hiệu quả và không cần nhiều sự trợ giúp. Tại sao phải có mức tối thiểu cho lập trình viên Front End? Từ kinh nghiệm làm việc trong nhiều nhóm phát triển phần mềm lớn nhỏ khác nhau, tôi nhận ra rằng một lập trình viên mới gia nhập rất cần được chỉ…
word cloud by wordle.net From my own experiences working in small and large development teams, I learned that setting a baseline of skills and workflow know-how among the people in a technical team is as much important as the coding conventions. Without a doubt, raising team members' skills (esp. juniors) to a standard will not only enhance collaboration (as they should know what others are doing)…
Recently I came across an annoying issue with web font (@font-face) in which the text does not appear vertically center within buttons or inputs (see image). Google around, I found that not all web fonts are affected, this defect seem to occur only on Mac/Linux and may vary in different browsers and is commonly referred to as "web font padding issue". It's interesting enough that although the…
This is the complete rework of the front page of my (now ex) agency to show case our experiences and expertise. The concept was that the whole site is a mind map which is often associated with brainstorming & ideas generating. The key feature of the site is the mind-map-like navigation in which you can drag to move in any direction. It works on both desktop and tablet's browsers. Looping…
This is a direct port of my AS3 Wordle Tag Cloud to HTML5. Please read my old blog post for some background. Some technical notes: Thanks to Canvas' RenderingContext2D.measureText(), I can calculate size of the words off browser's stage. Initially, I was using Canvas as rendering stage for the tag cloud. However, it demands extra work to make the words interactive. So I decided to use normal block…
Nowadays, there are many options to host a static website (portfolios, generated weblogs , front-end demos, etc.) for free. One of the best ways is to push your static files to a Github's repo and publish them through Github Page . A lesser known solution is to make use of Google App Engine (GAE). Actually, GAE is designed for building and publishing high-performance, highly scalable web…
This is a post-event highlighting microsite for Intεl Sοlμtiοn Sμmm!t 2012. The site is to capture the activities and everything related to event in the forms of videos, photos & other kind of materials. Audience of this microsite are participants of the event and other users of APɅC Intεl Channεl Pοrtal which is a member-only partners relation web site. Live URL:…
This is my adaptation from the Three.js Birds Demo which was featured in the famous HTML5 Music Interactive Film The Wilderness Downtown . The original birds demo was done by Mr.Doob based on the boids simulation . You can read more about behind the scene of The Wilderness Downtown and the flocks of birds simulation from his blog here . (Thank Mr. Doob for your awesome Three.js library and the…
When I visited this cave during the trip to the central provinces of Viet Nam. I wanted to capture it magnificence and beauty but the cave's texture was too complex to visualize its depth and space on 2D photos. I recalled this 3D photography technique and tried to take some stereo photos of the scenes (take 2 photos of the same scene from 2 slightly different position) and made them into 3D…
A recent project requires me to create a realistic running waterfall. For such task, what came first to my mind was to use animated GIF or PNG sprite sheet and loop them frame by frame. Then my friend, Justin, explored more with a semi-transparent water layer overlaying a static waterfall image using Photoshop & Flash. The result was really satisfying. So I decide to adopt it into our project…
When I started doing JavaScript, I kept searching for an ideal JS code editor that is free, lightweight and fast just like FlashDevelop, my favorite ActionScript counter part. (In case you're wondering, I have made a Wine mod of FD4 and been able to run it on Linux). Most JS editors I tried were Java-based, heavy and code assistance is as not good as I expected. Then I discovered SublimeText 2 and…
One of the projects to challenge my skill in JavaScript and HTML5. The original parallax scrolling experience is coded from scratch with the help of MooTools framework. I learned a lot from this project and got everything I need to handle larger front-end interactive websites. Visit the site . Technical features: HTML5 Boilerplate MooTools 1.4 ThreeJS 3D library & its Birds Demo CSS3's transition…
This is an HTML template for a privately developed CMS website. The job involved converting Photoshop .PSD files into HTML/CSS template, Javascripting validation for contact form and Google maps interaction. At the same time, I custom made the Flash banner carousel with the text & images customizable via XML feed. Due to CMS restrictions and corporate's guidelines, the template is rather…
My going back to Flash to experiment on Stage3D. The animation make use of Flare3D engine. Thanks to its built-in shaders and particles components, I was able to create the fireworks and the lightning effects without much trouble. However there's still room to improve the fireworks effect with more particles. View the demo .
A 360° walk-through of my office. This is a case study with the ThreeJS 3D engine for HTML5 Canvas and WebGL. I have adapted the ThreeJS WebGL equirectangular panorama demo , making it fall back to Canvas renderer when browser doesn't support WebGL. The overlaying markers are DOM objects. There's some coordinates conversion between ThreeJS 3D world and 2D DOM. In this adaptation, there are 2…
This is a case study that my team set out to explore HTML5 / CSS3 but it is also served as pitch deck for my company's profile presentation. This one-page parallax scrolling website is inspired by the one of the 2010 buzzing HTML5 experiences, nikebetterworld.com . Everything was coded from scratch. We developed 2 versions. The first version features usual parallax scrolling with arrow drawing…
This full flash minisite is part of a campaign to interactively inform users about Intel's partner membership program (APAC only) and guide them to earn more credits to enhance their membership level. There is a web service-driven section where weekly leading credit earners are listed to make the "race" more excited. The mechanism is relatively simple and straightforward. There's no demo link…
The aim of this site is to support Intel's partners and distributors in estimating their attendance in training courses offered by the company in order to maintain their privileged membership. For each type of membership, users have to select the courses with number of attendees, various training types and courses. The system will automatically calculate the credits members would be able to gain…
[This is a translation and edit of the article “ Molehill Getting Started ” from labs.jam3.ca ] PHẦN 2. TÌM HIỂU MOLEHILL (STAGE3D) API Trình độ: Cao Cấp Phần mềm File mẫu - Vững ActionScript 3 - Biết FlashDevelop - Biết Flash 3D hoặc 3D Engine - Flash Develop 4 ( tải về ) - Flex SDK 4.5 r.19786 ( tải về ) molehill_getting_start_p2.zip (TTT) Đây là bài viết giới thiệu về Molehill (Stage3D) API ở…
[This tutorial discusses How to get started with Molehill API via Away3D. You can find English equivalents from other sources easily] PHẦN 1. TIẾP CẬN MOLEHILL THÔNG QUA FLASH ENGINE AWAY3D Trình độ: Trung Cấp Phần mềm File mẫu - ActionScript 3 - Biết FlashDevelop - Từng sử dụng Flash 3D engine - Flash Develop 4 ( tải về ) - Flex SDK 4.5 r.19786 ( tải về ) molehill_getting_start_p1.zip I. Molehill…
This is my attempt to convert an old Flash animation (my old animated signature when I was young ;) ) to HTML5 using Adobe's Wallaby tool . Because of the nature of this animation, a lot of SVG files were generated. The total size of the HTML5 animation is 1.1MB compared to 21.6KB of the Flash counterpart. (OMG, way to much less efficient). I had to edit some JavaScript to add a preloader for it.…
You should have seen the aesthetic tag cloud above somewhere on the web. It originates from the famous Wordle words cloud (closed source). For the past few days, I have ported an open source Java class to ActionScript and able to render the tag cloud in Flash as seen above. Please refer to this article to have the Java author explain the basic of the algorithm. (Thank Pierre Lindenbaum for the…
2011 undoubtedly expects the multiple screen applications trend. Flash platform is one of the best solutions to deliver same experience across multiple devices and platforms. Here is a demo of Flash-based games on multiple (device) screens: PC, iPhone, iPad, Android phone (Motorola Milestone 2), Android tablet (Samsung Galaxy Tab). All the coding effort is credited to my Flash team. The iOS…
As a Flash Professional user, you probably have Adobe Media Encoder installed on your computer. This is a great tool to encode videos not only for Flash video player but also for other H.264-enabled devices like iPhone and Android. However, when I tried to encode a video using a random H.264 preset, my phone (a Milestone 2) could not play the video. This means that not every export settings is…
Another internal case-study project of Pyco Flash team to research multiplayer game with Red5. This is a 2D top-view real-time shooting game whose gameplay is similar to CS2D – you control your character moving round with WASD keys and aim and shoot with your mouse. The game showcases real-time synchronization among clients in a precision and fast-pace environment. The team have learnt a lot from…
The young and energetic people It was great honor for me to be invited to the first Flash conference in Viet Nam, Flash Camp Hanoi 2010. The event is a proving fact that Flash/Flex users community in Viet Nam has grown up and stronger than ever. All details and stories can be found at the official website: flashcamphanoi.com.vn (Update: the server is temporarily down, please access the overview…
This is a summary of what I studied and practiced with TDD & FlexUnit. This presentation is not for persuading developers applying unit testing but it will highlight benefits & vulnerabilities of TDD objectively. [Vietnamese tag: Bài thuyết trình về FlexUnit và mô hình phát triển phần mềm dựa trên kiểm thử / kiểm tra]
So, Adobe has discontinued its Linux version of Flex Builder. That’s sad news for us. Anyway, it doesn’t change much since Linux users already have alternatives long before, e.g. FDT , IDEA . Besides, I have been able to run Flash Builder 4 on my Ubuntu (via Wine) for a while to take advantage of its mxml coding hinting and the unique design view. Let me share some of my experiences of using Flash…
ActionScript 3 language reference document is any Flash developer’s bible. Whenever you implement something with Flash, you’ll find yourself checking this document regularly. There are plenty of ways to access this document: Open Flash CS* and press F1 to open it’s internal help panel. (Some of my friends do this even when they don’t have any fla to edit). In FlashDevelop, place the caret on a…
Today I’m very excited to announce my first open source library: as3-karaoke-player . It comes from a request to make a small karaoke website. The idea is that karaoke is a popular kind of entertainment in Vietnam so I thought I would make the core rendering engine open source so that everyone especially my fellow developers can make and/or enjoy karaoke online. (About the said karaoke site, of…