Home Blog Page 222

9 ứng dụng tuyệt vời được viết bằng React Native

9 thương hiệu nổi tiếng viết app bằng React Native - bạn đã biết?

Ý tưởng tạo ứng dụng chỉ sử dụng một kiểu mẫu cho tất cả các nền tảng có vẻ không thực tế chút nào. Tuy nhiên, React Native, mặc dù chưa thật sự hoàn thiện, nhưng cho phép đẩy nhanh quá trình xây dựng các ứng dụng trên các nền tảng khác nhau, nhờ khả năng sử dụng lại hầu hết các code giữa chúng. Dưới đây là danh sách những công ty nổi tiếng có app viết bằng React Native

Tuyển dụng lập trình viên React Native lương cao

Facebook

React Native bắt đầu khi dự án hackathon của Facebook phát triển để đáp ứng nhu cầu của công ty. Facebook muốn mang lại tất cả các lợi ích của phát triển web – chẳng hạn như lặp đi lặp lại nhanh và có một đội xây dựng toàn bộ sản phẩm – di động. Đó là cách React Native đã được đưa vào cuộc sống và tận dụng trong phát triển ứng dụng dành cho thiết bị di động cho cả ứng dụng iOS và Android.

Nhóm lập trình đã chuyển đổi tính năng Events Dashboard trong ứng dụng Facebook cho iOS sang React Native để kiểm tra hiệu suất ứng dụng, chẳng hạn như thời gian khởi động, điều này rất quan trọng trong loại hình ứng dụng này. Đây là một phần quan trọng trong ấn tượng ban đầu của người dùng về ứng dụng và xác định liệu chúng có tồn tại hay ra đi không. Những gì họ đạt được là cắt giảm thời gian tìm hiểu thị trường một nửa. Đọc về cuộc hành trình của họ với React Native tại đây.

Skype

Skype gần đây đã thông báo rằng họ đang thử nghiệm một ứng dụng Android mới được viết bằng React Native. Đó là một thông tin khá tốt cho tất cả người dùng, vì ứng dụng hiện tại gặp nhiều vấn đề. Phiên bản mới hoàn toàn được cải tiến bắt đầu từ các icon cho toàn bộ bố cục, thêm một vài tính năng gọn gàng nữa. Như Microsoft cũng đã thông báo, Skype Preview cho iOS đã có sẵn với số lượng giới hạn thông qua TestFlight của Apple dành cho Skype Insiders.

Cũng cần lưu ý rằng GitHub repo với plugin React Native cho Universal Windows Platforms gần đây đã được chuyển sang Microsoft. Điều đó có nghĩa là không chỉ Skype cho iOS mà còn là một phiên bản dành cho máy tính để bàn, đây sẽ là dự án React Native lớn đầu tiên của Windows. Đây là một dấu hiệu tốt cho nền tảng này. Sớm thôi chúng ta sẽ có thể thấy React Native hoạt động khá tốt trên Windows.

Facebook Ads

Nền tảng mạng xã hội không phải là ứng dụng React Native duy nhất được phát triển dưới mái nhà của Facebook. Quảng cáo trên Facebook thực sự là ứng dụng React Native đầu tiên dành cho Android và là ứng dụng React Native hoàn chỉnh đầu tiên được xây dựng trong công ty. Framework dường như hoàn toàn phù hợp với rất nhiều business logic phức tạp cần thiết để xử lý chính xác các định dạng quảng cáo, múi giờ, định dạng ngày, tiền tệ, công ước tiền tệ, vân vân, đặc biệt là một đoạn lớn đã được viết bằng JavaScript. Trên hết, việc thực hiện các UI nhiều dữ liệu sẽ dễ dàng hơn với React Native.

Nhiều thành phần được phát triển cùng với ứng dụng Facebook Ads rất hữu ích cho các nhà phát triển khác trong việc xây dựng ứng dụng của họ.

Đọc thêm về ứng dụng React Native hoàn chỉnh đầu tiên từ Facebook.

Instagram

Instagram đã vượt qua thử thách để tích hợp React Native vào ứng dụng gốc hiện tại của họ, bắt đầu từ chế độ xem đơn giản nhất mà bạn có thể tưởng tượng: chế độ Push Notifications đã được triển khai thực hiện dưới dạng WebView. Nó không yêu cầu xây dựng cơ sở hạ tầng navigation, vì UI khá đơn giản.

Đội ngũ lập trình tại Instagram đã phải đối mặt với một số vấn đề trong quá trình, nhưng họ đã cải thiện đáng kể tốc độ phát triển. 85% đến 99% code được chia sẻ giữa các ứng dụng Android và iOS, tùy thuộc vào sản phẩm, do đó nhóm đã có thể cung cấp ứng dụng nhanh hơn nhiều so với các giải pháp thông thường.

Đọc thêm tại blog kỹ thuật của Instagram.

Walmart

Walmart nhằm tới mục đích thực sự cao, khao khát trở thành nhà bán lẻ trực tuyến lớn nhất thế giới. Với những mục tiêu lớn như vậy, công ty cần phải có những hành động táo bạo có nguy cơ cao hơn để đạt được lợi thế cạnh tranh. Đó là lý do tại sao họ luôn tìm cách cải thiện trải nghiệm của khách hàng bằng cách thử các công nghệ mới. Walmart đã chứng minh khả năng sáng tạo của mình khi giới thiệu Node.js vào stack của họ. Một vài năm sau, họ cũng viết lại ứng dụng trên thiết bị di động của họ thành React Native.

Walmart đã cải thiện hiệu suất của ứng dụng trên cả iOS và Android bằng cách sử dụng ít tài nguyên hơn và trong khoảng thời gian ngắn hơn. 95% codebase được chia sẻ giữa các nền tảng trong khi các kỹ năng và kinh nghiệm của các lập trình viên đã được tận dụng trong toàn công ty. React Native cho hiệu suất tuyệt vời, gần như giống với các ứng dụng gốc, và hình động cực kỳ mượt.

Đọc thêm về câu chuyện thành công của họ.

Airbnb

Airbnb cũng đã tích hợp React Native vào ứng dụng di động của họ. Những gì họ nhận thấy lần đầu tiên khi làm việc với framework này là chi phí tích hợp với các ứng dụng gốc hiện tại rất cao, nhưng với không sao. React Native rất dễ bắt đầu, nhưng một số thách thức đã xuất hiện trên đường phát triển. Vấn đề chính là những người mới sử dụng React đã gặp phải một số khái niệm về quản lý trạng thái trong một ứng dụng React. Lợi thế lớn nhất, là khả năng sử dụng lại code. Hầu hết các thành phần đều có thể tái sử dụng được. Hơn nữa, React đã tạo code rất dễ dàng để tái cấu trúc và lặp lại.

Xem thêm về hoàn thiện React Native của Airbnb trong cuộc trò chuyện công nghệ này.

SoundCloud Pulse

SoundCloud Pulse là một ứng dụng dành cho người sáng tạo giúp họ quản lý tài khoản và giữ cho cộng đồng của họ sôi động. Khi công ty bắt đầu thiết kế bộ ứng dụng gốc thứ hai, họ phải đối mặt với một vài trở ngại. Không thể tìm thấy các lập trình viên iOS và họ không muốn có một khoảng cách lớn giữa bản phát hành iOS và Android. Do đó, một nhóm nghiên cứu độc lập đã bắt đầu chạy các phiên thử nghiệm người dùng bằng các nguyên mẫu dựa trên React Native.

Mặc dù có một số điểm yếu mà nhóm nghiên cứu tại SoundCloud nhận thấy, tuy nhiên kinh nghiệm của họ với framework này nhìn chung là tích cực. Các lập trình viên thấy rằng dễ dàng làm việc trên một ứng dụng dựa trên React hơn trên một ứng dụng nguyên thuỷ. Hơn nữa, họ có khả năng xây dựng ứng dụng mà không có đầu vào thường xuyên từ các nhà phát triển điện thoại di động chuyên dụng. Đọc thêm về cuộc hành trình của họ trên blog công nghệ của họ.

Yeti Smart Home

Nhóm lập trình tại Yeti Smart Home đã phải đối mặt với một vấn đề tương tự như ở SoundCloud. Họ thiếu lập trình viên phát triển iOS và Android nhưng họ thực sự muốn bắt đầu xây dựng các ứng dụng “gốc”. Đó là lý do tại sao họ chuyển sang React Native, là framework tốt hơn là học từ đầu, để tạo ra những trải nghiệm tốt trên Swift và Java. Lúc đầu không phải đơn giản, vì React Native vẫn còn chưa hoàn thiện. Nhưng với thời gian và sự đóng góp của cộng đồng mã nguồn mở đang phát triển, dự án phát triển nhanh và nhanh hơn nữa, sau đó họ có thể vượt khỏi màn hình di động để thiết kế các thành phần có thể kiểm soát các thiết bị khác nhau. React Native nhờ cách xây dựng module của nó, đã làm cho nó có khả năng tái sử dụng những “viên gạch nhỏ” để xây dựng lại giao diện. Đọc thêm về trải nghiệm của họ với React Native tại đây.

Uber Eats

Uber gần đây đã chia sẻ thông tin chi tiết của họ về việc tận dụng React Native trong kỹ thuật của ứng dụng phân phối thực phẩm của họ. Không giống như ứng dụng Uber chuẩn, thị trường Uber Eats liên quan đến ba bên: nhà hàng, người giao hàng và người dùng. Mô hình như vậy đòi hỏi một bảng điều khiển bổ sung cho các nhà hàng. Bảng điều khiển Nhà hàng ban đầu đã được xây dựng cho web và nó cung cấp truy cập hạn chế các chức năng thiết bị gốc, chẳng hạn như thông báo âm thanh là một vấn đề quan trọng cho trải nghiệm của người dùng. Vì nhóm đã có thí nghiệm sử dụng React nhưng giới hạn số lần hiển thị iOS / Android nên họ đã quyết định xây dựng lại bảng điều khiển bằng React Native. Mặc dù framework chỉ là một phần nhỏ của công nghệ được sử dụng trong Uber Eats nhưng các lập trình viên đánh giá tốt về khả năng và năng lực của nó, có thể giúp họ đáp ứng nhu cầu khi thị trường phát triển.

Đương nhiên, có rất nhiều ứng dụng được viết bằng React Native và chúng ta có thể thấy rằng một mảnh đất ngày càng tăng cho framework trong tương lai phát triển. Mặc dù chưa hoàn thiện và lỗi, nhưng nó mang lại một loạt các khả năng. Với sự tăng trưởng của cộng đồng và sự phổ biến rộng hơn, chúng ta có thể thấy nhiều ứng dụng React Native hơn xuất hiện trong tương lai gần.

Tham khảo thêm các vị trí tìm việc it lương cao tại Topdev.

Đọc thêm:

Nguồn: Techtalk via Netguru

Lập trình hướng chức năng đang thống trị mảng UI với Pure Views

Những năm gần đây đã chứng kiến sự cải thiện rất lớn trong cách UI được phát triển bằng cách sử dụng Purely Functional Views. Trong lập trình hướng chức năng “pure function” là một trong số function khi chạy, trả về một giá trị nhưng không thay đổi bất cứ điều gì (còn được gọi là side-effect free function). Điều này làm giảm đáng kể việc load cognitive và permutations trong các ứng dụng để có thể giảm được rất nhiều bug (xem trường hợp nghiên cứu), dễ hiểu, dễ tương tác và ổn định vô cùng.

David Nolen có một trong những cách giải thích tốt nhất cho kiểu phát triển UI này, ƒ (d) = V. Đó là một chức năng nhận dữ liệu làm đầu vào của nó và trả về dưới chế độ view. Không scoping, binding, subclassing, truy cập từ bên ngoài vào các biến hoặc bất kỳ tác dụng phụ. Điều này làm cho nó trở nên rất có thể đoán được chỉ cần nhìn qua Pure View được chạy. Trong thế giới JavaScript bạn có thể nói, Cho bất kỳ JSON nào cũng sẽ tạo ra các trình listener HTML, CSS và sự kiện tương tự.

Tại sao Pure Views khác với các kiểu UI khác?

Để hiểu kỹ về điều này, chúng ta cần phải hiểu những gì chúng ta đã ngầm làm trong nhiều năm trong code của chúng ta. Code được viết như một chuỗi các permutation phức tạp. Mỗi chức năng chúng ta call đều thay đổi một cái gì đó bên ngoài phạm vi private. Sau đó chúng ta call một hàm khác thay đổi cái gì đó khác. Nếu dữ liệu hoặc thứ tự của các chức năng này call deviate trong bất kỳ cách nào bug sẽ đến bất ngờ. Hãy suy nghĩ về những lần bạn fix bug được tạo ra bởi một cái gì đó dường như không liên quan trong class khác hoặc server một nơi nào đó. Đây là những vấn đề lớn về permutation.

Hãy xem bảng dưới đây. Đây là cách chúng tôi suy nghĩ về nội bộ của các ứng dụng.

Cách chúng tôi “nghĩ” cách ứng dụng của chúng tôi hoạt động.

Rất rõ ràng, phải không? Call “login ()”, rồi “getUser ()” rồi “getCart ()”. Trong thực tế luồng ứng dụng của chúng tôi bao gồm các đường dẫn lỗi, các giá trị bất ngờ, network và luồng. Nếu chúng trở lại với một thứ tự hơi khác hoặc dữ liệu hơi khác nhau hoặc dữ liệu bị biến đổi bởi nhiều class trong ứng dụng của chúng tôi, chúng sẽ tạo ra bug. Đây là mô hình chính xác hơn về các nhánh:

Cách ứng dụng của chúng tôi hoạt động thực sự.

Nếu bất cứ điều gì không đi theo hướng dự kiến vào thời gian dự kiến chúng tôi nhận được bug. Lớp OOP được cho là dữ liệu đóng gói, sự kiện và biến đổi bên trong ranh giới của nó để làm việc này mà không có bug. Rõ ràng chúng ta đều có thể gặp bug. Nhưng hệ thống rất khó bởi vì chúng phức tạp để tạo ra bug.

Đơn giản dễ dàng

Đối với bất cứ ai đã học về Gang of Four and Object-Oriented Patterns nhưng chưa xem bài nói chuyện của Rich Hickey “Simple Made Easy” hãy xem nó ngay bây giờ. Khái niệm cốt lõi mà Hickey nói đến là làm thế nào mà quá nhiều yếu tố bên ngoài là một lý do chính tại sao chúng ta không hiểu rõ code của chúng ta đang làm gì khi chúng ta đọc nó. Không dễ vì quá nhiều điều được thực hiện cùng một lúc. Ngôn ngữ hướng đối tượng có các pattern cố gắng giảm sự phức tạp đó bằng cách sử dụng encapsulation. Các ngôn ngữ chức năng, có khả năng cao composability là tính năng chính để giảm sự phức tạp. Một sự kết hợp tốt hơn của cả hai là cần thiết để có được kiểm soát tốt hơn UI của chúng tôi.

Pure Views mang lại một số lợi ích của ngôn ngữ chức năng cho thế giới OO mà hầu hết các lập trình viên sử dụng. Trong ngôn ngữ chức năng, pure function chỉ làm một điều và không có tác dụng phụ (không tác dụng phụ có nghĩa là nó không ảnh hưởng đến bất cứ điều gì, chỉ trả về một giá trị mới). Nhiều chức năng đơn giản có thể được tạo ra theo nhiều cách khác nhau để tạo ra nhiều loại dữ liệu đầu ra. Để giải thích Rich Hickey, đơn giản có nghĩa là làm một việc. Dễ dàng có nghĩa là chúng ta có thể hiểu được tổng quan. Trong trường hợp của Pure View, nhìn vào chức năng render chúng ta có thể hiểu được tất cả các đầu ra tiềm năng. Nó làm giảm yêu cầu hiểu toàn bộ cơ sở code để biết làm thế nào nó có thể có tác dụng đến một chức năng duy nhất.

Đây là cách chế độ Pure View sẽ hoạt động:

Pure Views là những biến đổi đơn giản mà không có tác dụng phụ.

Đây là một khái niệm vô cùng mạnh mẽ. Thay vì phải truyền thông qua chức năng, sự kiện và các network stack và thay đổi ở mọi nơi, chỉ cần chụp nhanh dữ liệu và hiển thị với chế độ view. Chế độ view sẽ có tất cả các bố cục, trình xử lý sự kiện và các điểm truy cập để người dùng tương tác với các dữ liệu cơ bản. Điều này có nghĩa là để có đến được bất kỳ vị trí trong ứng dụng, chỉ phụ thuộc là một mô hình dữ liệu tĩnh. Nói chung các Pure View này được kết hợp với các phương pháp vòng đời để hiểu rõ hơn khi nào, tại sao và dữ liệu thay đổi như thế nào. Ví dụ: hãy xem một số code thực sự của Pure View:

createView({
  getDefaultProps(){
    return {
      selectedIds: [1, 10],
      banks: [/* bank data here */]
    };
  } 
  render(){ 
    let selectedBanks = this.props.banks.filter(function(bank){
      return this.props.selectedIds.indexOf(bank.id) > -1;
    });
    let bankItems = [];
    for (let i=0; i < selectedBanks.length; i++){
      bankItems.push(
        el("BankItem", {key:i, bank:selectedBanks[i]})
      );
    }
    return el("div", null,
             el("h1", null, "Selected Banks"),
             bankItems,
             el("a", {href:"/install", "Next")
           );
  }
})

View này encapsulate các thuộc tính được chuyển bởi parent của nó. Khi chức năng render được call, nó không yêu cầu bất cứ điều gì ngoài phạm vi chính của view. Tất cả mọi thứ có thể ảnh hưởng đến đầu ra tất cả đều trong một chức năng duy nhất. Cho đến khi chức năng render kết thúc, props và state cũng không thể thay đổi. Điều này làm cho nó dễ dàng hiểu lý do về những gì sẽ xảy ra trên mỗi lần chạy. Bất cứ khi nào parent gửi dữ liệu mới, nó sẽ kích hoạt chức năng render để chạy lại.

Mở rộng khả năng mà không cần phức tạp thêm

Bởi vì Pure View chỉ làm một việc và không ảnh hưởng gì đến những ngoài phạm vi của nó, nó làm cho nó trở nên cực kỳ linh hoạt mà không có sự phức tạp. Có một vài trường hợp cho thấy sức mạnh thực sự của Pure View.

Việc đầu tiên được gọi là Hot Module Replacement. Nếu bạn nghĩ rằng điều này cũng giống như Live Reloading trong trình duyệt, bạn sẽ không còn hứng thú nữa. Ngay khi bạn lưu file trong editor, chỉ có code mới cập nhật được gửi đến app của bạn, thay thế code cũ, chức năng hiển thị cho chế độ view được chạy và chỉ HTML khác thay đổi. Toàn bộ data layer của ứng dụng không bị ảnh hưởng. Điều này làm việc với layout, view hierarchy và xử lý sự kiện. Dữ liệu trong app không thay đổi vì vậy bạn đang được xem dữ liệu cập nhật theo thời gian thực. Có thư viện để hỗ trợ điều này trong trình duyệt, ứng dụng iOS, Android, Windows và Mac. Khi thời gian lặp giữa việc thực hiện thay đổi code và nhìn thấy đầu ra gần 0, nó thay đổi hoàn toàn quy trình code của bạn.

Tiếp theo là Time Travel Debugging. Nó thực sự tuyệt vời như cái tên. Nếu không có Pure View, lưu trữ tất cả các sự kiện propagation và tác động của nó đến view là impossible load cho hầu hết các hệ thống. Với Pure Views tất cả những gì cần thiết là có một mảng và đẩy một bản sao của dữ liệu mới mỗi khi nó thay đổi. Nếu bạn hiểu cấu trúc dữ liệu liên tục hoạt động, công việc thậm chí còn ít hơn để lưu mọi thay đổi trong app của bạn. Khi gỡ lỗi, chỉ cần scrub back và forth giống như một VCR. (Công nghệ UI những năm 80,  Yeah những năm 80 và hầu hết các UI framework không có debug toolkit như ngày hôm nay). Application state thậm chí có thể được xếp theo thứ tự và lưu trên máy chủ trong quá trình sản xuất để có được các bước repo đầy đủ về mọi lỗi trong ứng dụng của bạn.

Khả năng chuyên dụng cuối cùng là Resiliency Over Rigidity. Dữ liệu không được gắn với UI. Rõ ràng tách biệt là điều cần quan tâm. Data layer ứng dụng của bạn có thể tập trung về chức năng, chuyển đổi dữ liệu và cache mà không cần phải suy nghĩ về tất cả những mối quan tâm mà người dùng có thể có. Về phần lớn các dự án business logic hầu như không thay đổi; Code cho một giỏ mua hàng comm khá nhiều có các yêu cầu tương tự. Nhưng trên View layer, các nhà thiết kế luôn tìm ra cách mới để giải thích hoặc làm rõ giao diện hoặc tăng doanh thu. Các bài kiểm tra đơn vị và tích hợp có thể tập trung vào việc kiểm tra lưu lượng ứng dụng trong dữ liệu thuần túy, đơn giản. Vì View chỉ là một phép biến đổi đơn giản và phản ánh dữ liệu ở bất kỳ trạng thái nào, nó ít bị ảnh hưởng bởi complexity hoặc bug. Điều này cũng có nghĩa là khi người thiết kế hoặc giám đốc kinh doanh yêu cầu thay đổi chế độ view, nó có thể được thực hiện mà không ảnh hưởng đến chức năng của luồng dữ liệu.

Quay trở lại với thực tế

Pure View đang phát triển. Có rất ít, nếu có bất kỳ tiện ích truyền thống view layer trên Pure View. Framework mở rộng hơn như Backbone bạn có thể trao đổi ra các hệ thống templating string cho Pure View. Ngày càng có nhiều tác giả framework đang nhìn thấy những lợi thế và hướng đến Pure Views. Một vài framework đáng chú ý thực sự là Elm, Ember 2, Om Next, ReactJS.

Để tận dụng lợi thế của một số khả năng mở rộng Pure View cung cấp thì có một số công cụ out-of-the-box mà dễ dàng hơn để tích hợp. Đối với Hot Module Replacement, Webpack và React là lựa chọn tuyệt vời. Tôi duy trì một bộ starter kit được gọi là Megatome, cái này sẽ giúp bạn bắt đầu và chạy một dự án mới trong vòng 2 phút. Đối với Time Travel Debugging xem như Redux với data layer  được xây dựng để làm việc với React.

Lưu ý cuối cùng là dành cho tất cả những người xem xét kỹ lưỡng cú pháp (ví dụ như Lisps hoặc JSX): không đánh giá một cuốn sách qua trang bìa của nó. Nếu bạn không nhìn kỹ hơn, bạn hoàn toàn có thể bỏ qua các khả năng và sức mạnh có thể đến từ một cái gì đó khác nhau. Nhìn lại đoạn code ở trong Pure View ở trên. Đó là tất cả các code hợp lệ mà không cần phải transpilation, quản lý package hoặc bất kỳ bước build bổ sung nào. Điều duy nhất mà mất là:

let el = React.createElement;
let createView = React.createClass;

Techtalk via Freecodecamp

GraphQL – Công nghệ mới cho web developer

GraphQL là gì? Nếu bạn cũng như tôi, một tín đồ về lập trình thì hẳn bạn cũng trải qua 3 khung cảm xúc mỗi khi nghe tin công nghệ mới xuất hiện:

1.Chán nản:

Lại thêm một JavaScript library?! Sao không xài jQuery quách cho rồi?

2.Quan tâm:

Hmm, cũng được đấy, để check thử cái library mới này xem sao?

3.Hoảng loạn:

Thôi chết rồi, hoặc là phải biết xài thằng này không thì chỉ có nước hửi khói tụi khác!

Cách để giữ bạn không phải phát điên lên khi trải qua 3 giai đoạn trên là phải học được những thứ mới mẻ ngay giữa giai đoạn 2 và 3, khi mà bạn đã có hứng thú về nó nhưng công nghệ vẫn còn mới mẻ chưa được biết đến nhiều.

Vì thế mà bây giờ là thời điểm hoàn hảo để học về GraphQL mà mọi người luôn bàn tán gần đây.

GraphQL là gì?

GraphQL là một cú pháp mô tả cách yêu cầu lấy dữ liệu, và thường được dùng để load data từ một server cho client.

GraphQL bao gồm 3 điểm đặc trưng bao gồm cho phép client xác định chính xác những gì dữ liệu họ cần, làm cho việc tổng hợp dữ liệu từ nhiều nguồn dễ dàng hơn và nó sử dụng một type system để mô tả dữ liệu.

Vấn đề

GraphQL bắt đầu từ ông lớn Facebook, thế nhưng ngay cả những app đơn giản đôi khi vẫn gặp phải trường hợp “nghẽn cổ chai” do sự hạn chế của REST APIs.

Thí dụ bạn muốn hiển thị một list posts, và ở dưới mỗi post là một list like, bao gồm cả tên người dùng và avatar. Cách giải quyết đơn giản là thay đổi API của ‘posts’ để nó bao gồm a ‘like’ array chứa thông tin về người dùng.

  10+ tools và extensions tuyệt vời cho GraphQL APIs
  Cùng tìm hiểu về GraphQL

graphql

Thế nhưng khi làm như vậy cho các app mobile thì bạn sẽ phát hiện ra tốc độ của chúng chạy quá chậm. Vì thế mà giờ đây bạn sẽ cần tới 2 endpoints, một với likesvà một thiếu chúng.

Giờ thì còn có thêm một vấn đề khác xuất hiện: trong khi postsđược lưu trữ trong một MySQL database thì likes lại được lưu tại Redis store! Bạn biết mình phải làm gì trong trường hợp nào không?

Mở rộng vấn đề trên ra với việc Facebook phải quản lí vô số data source và API clients thì cũng là điều dễ hiểu khi REST APIs bị đánh giá là cũ kĩ bởi những hạn chế của nó.

Giải pháp

Giải pháp mà Facebook đưa ra đến từ một ý tưởng rất đơn giản: Thay vì có đến hàng tá “endpoint” ngu ngốc, sao lại không dùng chỉ một “endpoint” thông minh với khả năng tiếp thu những Query phức tạp rồi đưa ra output data với loại type tùy theo yêu cầu của client.

Thế tế mà nói, GraphQL như là một layer nằm giữa client và data source, sau khi nhận yêu cầu của client thì nó sẽ kiếm những thông tin cần từ các data source và đưa lại cho client theo format họ muốn. Vẫn chưa hiểu? Thế thì đến lúc dùng ví dụ ẩn dụ rồi đây!

  GraphQL - Công nghệ mới cho web developer
Xây dựng forum bằng GraphQL, React, Apollo và Prisma – Part 1 :Application Introduction and Technologies Overview”]

  Tại sao bây giờ là thời điểm thích hợp để học GraphQL?

Như bạn thấy đấy, REST model cũ giống y như việc bạn đặt cái bánh Pizza, rồi gọi ship hàng online và kêu bên tiệm giặt ủi đem đồ đến cho bạn. Tất cả diễn ra với 3 cuộc gọi và 3 cửa hàng.

graphql

GraphQL mặt khác lại giống như là thư kí riêng của bạn vậy: Sau khi bạn đưa địa chỉ của 3 cửa hàng và nói yêu cầu của bạn thì GraphQL sẽ làm hết mọi chuyện còn lại trong khi bạn chỉ việc chờ chúng được chuyển đến cho mình.

graphql

Nói cách khác GraphQL tạo ra một ngôn ngữ chuẩn (standard language) để thực hiện những công việc này.

graphql

GraphQL API được tạo ra từ 3 phần chính: schema, queries, và resolvers

Queries

Những yêu cầu bạn đặt ra cho thư kí của mình, GraphQL, được gọi là query và nó giống như thế này:

query {
  stuff
}

Chúng ta tuyên bố một ‘query’ mới sử dụng keyword query , và đặt tên cho field đó là stuff. Điều thú vị của GraphQLquery là có support các nested fields. Thế nên chúng ta có thể đi sâu vào hơn:

query {
  stuff {
    eggs
    shirt
    pizza
  }
}

Như bạn thấy đấy, client khi đưa ra những yêu cầu và tạo ra query sẽ không cần lo data đến từ source nào. Chỉ việc hỏi và GraphQLserver  sẽ lo hết mọi thứ khác.

Cũng đáng lưu ý là việc các query field còn có khả năng chỉ đến các array

query {
  posts { # this is an array
    title
    body
    author { # we can go deeper!
      name
      avatarUrl
      profileUrl
    }
  }
}

Query field còn support cả argument. Nếu bạn muốn đưa ra một post riêng, thì chỉ cần thêm id argument cho post field.

query {
  post(id: "123foo"){
    title
    body
    author{
      name
      avatarUrl
      profileUrl
    }
  }
}

Cuối cùng, nếu bạn còn muốn id argument đó đặc biệt hơn, bạn có thể tạo ra một variable và tái sử dụng chúng bên trong query (nhớ là ta phải đặt tên cái query đó luôn)

query getMyPost($id: String) {
  post(id: $id){
    title
    body
    author{
      name
      avatarUrl
      profileUrl
    }
  }
}

Một cách thực hành khá tốt là sử dụng GitHub’s GraphQLAPI Explorer. Hãy thử query sau:

query {
  repository(owner: "graphql", name: "graphql-js"){
    name
    description
  }
}

graphql

Bạn sẽ thấy rằng việc bạn thử đặt tên cho một field ở bên dưới description, IDE sẽ tự động gợi ý cho bạn những tên field có sẵn hoặc tự tạo bởi chính GraphQLAPI ! Khá hay đúng không?

lập trình web

Resolvers

Cho dù có là thư ký giỏi nhất quả đất cũng không thể đi lấy quần áo cho bạn nếu không có địa chỉ của tiệm giặt đồ.

Tương tự vậy, GraphQLserver sẽ không biết phải làm gì với query bạn đưa ra trừ khi nó biết được resolver.

Resolver nói cho GraphQL biết nơi và cách thức để lấy data cần thiết cho field của query mà bạn yêu cầu. Sau đây là một resolver cho field `post` ở trên (sử dụng Apollo’s GraphQL-Tools schema generator):

Query: {
  post(root, args) {
    return Posts.find({ id: args.id });
  }
}

Ta đặt resolver ngay trong Query bởi vì ta muốn query cho post ngay lập tức. Tuy nhiên, bạn vẫn có thể dùng resolver trong sub-field, như author field của post

Query: {
  post(root, args) {
    return Posts.find({ id: args.id });
  }
},
Post: {
  author(post) {
    return Users.find({ id: post.authorId})
  }
}

Nhớ lưu ý rằng resolver sẽ không bị giới hạn bởi trong số lượng thông tin được đưa về nên bạn sẽ muốn thêm commentsCount cho Post type:

Post: {
  author(post) {
    return Users.find({ id: post.authorId})
  },
  commentsCount(post) {
    return Comments.find({ postId: post.id}).count() 
  }
}

Điều quan trong bạn cần hiểu ở đây là với GraphQL, API schema của bạn và database schema sẽ bị chia ra riêng biệt. Nói cách khác, có thể sẽ không có bất kì author và commentsCount nào trong database của mình nhưng ta vẫn có thể “mô phỏng” chúng nhờ vào resolver.

  Hướng dẫn bắt đầu GraphQL với Node.js (Phần 1)
  Hướng dẫn bắt đầu GraphQL với Node.js (Phần 2)

Bạn có thể viết bất kì code gì trong resolver, vì thế mà bạn có thể dùng chúng để sửa đổi nội dung của database, vốn còn được gọi là mutation resolver.

Schema

Tất cả mọi thứ hay ho trên đều nhờ vào hệ thống GraphQL’s typed schema. Vì mục đích bài viết này chỉ là đơn giản giới thiệu nên tôi sẽ không có giải thích thêm cho rắc rối.

Tuy vậy, tôi khuyên bạn nên vào đọc GraphQLdocumentation nếu như có hứng thú.

Câu hỏi thường gặp

Mối quan hệ giữa GraphQL và graph database là như thế nào?

Thật ra là chẳng nhiều, như họ hàng rất xa ấy, GraphQL chả có dính dáng gì tới graph database như Neo4j. Phần “graph” đến từ ý tưởng theo dõi API graph bằng field và subfield trong khi “QL” ám chỉ cho “query language”

Rest vẫn còn tốt chán, sao lại phải chuyển qua GraphQL?

Nếu như bạn vẫn chưa bị phiền bởi sự hạn chế của Rest thì tốt thôi! Bởi việc dùng GraphQL thay vì REST chắc cũng sẽ không ảnh hưởng đến trải nghiệm người dùng từ app của bạn thế nên việc thay đổi cũng không phải mang tính sống còn hay gì. Tuy vậy, tôi vẫn khuyến khích bạn thử GraphQL trong một project nhỏ nếu có cơ hội.

Liệu tôi có thể dùng GraphQL mà không cần tới React/Relay/Các loại library?

Tất nhiên là được! Bởi GraphQL chỉ đơn giản là một kỹ thuật, bạn có dùng nó trên bất cứ library và platform nào bạn thích cùng với client hoặc tự tạo ra một GraphQL server.

GraphQL tạo ra bởi Facebook mà tôi thì chả tin vào Facebook

Lần nữa, GraphQL chỉ là một kĩ thuật, điều đó có nghĩa là bạn có thể dùng những ứng dụng của GraphQL mà không phải chạy bất kì một dòng code nào của Facebook.

Đồng thời với sự giúp đỡ của Facebook quả là một điểm cộng cho ecosystem của GraphQL, tại thời điểm này tôi tin rằng cộng đồng phát triển đã đủ lớn để GraphQL tiếp tục sống cho dù Facebook có ngưng xài nó.

Cả cái mô hình kinh doanh “để client yêu cầu data mà họ cần” nghe có vẻ không an toàn….

Tại bạn là người viết ra resolver, nó hoàn toàn phụ thuộc vào bạn để đưa ra những cách thức an ninh.

Nếu bạn cho phép client được phép truy cập một số các thông tin đặc biệt thì bạn sẽ muốn hạn chế số lượng nhằm tránh việc client yêu cầu quá nhiều.

Vậy tôi nên bắt đầu từ đâu đây?

Thông thường mà nói, bạn sẽ cần 2 thứ sau để có thể chạy một app tạo ra từ GraphQL:

  • một GraphQL server với mục đích phục vụ cho API của bạn
  • một GraphQL client để kết nối với endpoint của bạn

lập trình web

GraphQL Servers

Điều đầu tiên bạn cần là một GraphQL server. Bản thân GraphQL chỉ là một kĩ thuật thế nên vẫn còn nhiều khoảng trống cho việc cải thiện.

GraphQL-JS (Node)

Vốn là nguồn tham khảo để cải thiện cho GraphQL. Bạn có dùng nó kèm với express-graphql để tạo ra API server cho mình.

GraphQL-Server (Node)

Nhóm Apollo có riêng hẳn một GraphQL server implementation, tuy là không được biết đến nhiều như bản chính nhưng vẫn phát triển cực kì nhanh.

Các Platform khác

GraphQL.org có hẳn một list về các implementation của GraphQL trên các platform khác nhau

GraphQL Clients

Relay

Relay là bộ GraphQL toolkit của chính Facebook. Tôi vẫn chưa xài đến nó, nhưng theo những gì nghe được thì có vẻ Relay được tạo ra dựa trên những yêu cầu của Facebook thế nên nó có vẻ hơi đòi hỏi quá mức kĩ thuật so với đại đa số người dùng.

Apollo Client

Dù chỉ mới xuất hiện nhưng đã nhanh chóng soán ngôi bá chủ, Apollo client thường bao gồm 2 yếu tố sau:

  • Apollo Client, dùng để chạy GraphQL query trên các trình duyệt web cũng như lưu trữ data của họ.
  • Một kết nối cho front-end framework của bạn (React-Apollo, Angular-Apollo, etc.)

Cần nhớ rằng nếu để ở chế độ default, Apollo-client sẽ lưu dữ liệu của nó bằng Redux, một library khá tốt với hệ ecosystem đa dạng.

lập trình web

Open-Source Apps

Dù rằng GraphQL vẫn còn khá mới, đã có kha khá các open-source apps tận dụng nó:

VulcanJS

topdev

Đầu tiên tôi cần nói trước rằng tôi hiện tại đang là lead maintainer cho VulcanJS. Tôi tạo ra VulcanJS nhằm để mọi người tận dụng sức mạnh của React/GraphQL stack mà khỏi mất công viết code quá nhiều. Cứ nghĩ đơn giản nó giống như là “đường ray cho modern web ecosystem”, giúp bạn tạo ra những CRUD app (Kiểu như vầy) chỉ trong vài tiếng đồng hồ.

Gatsby

Là một trang generator cho React static, giờ đã được cung cấp bởi GraphQL kể từ phiên bản version 1.0. Dù nghe có vẻ là sự kết hợp lạ lùng nhưng nó thật sự cực kì mạnh mẽ. trong quá trình building, Gatsby có thể thu thập data đến từ nhiều nguồn của GraphQLAPI sau đó sử dụng chúng để tạo ra một static client-only React app hoàn chỉnh.

Một số GraphQL Tool khác

GraphiQL

GraphiQL cực kì hữu dụng cho trong trình duyệt IDE cho query GraphQL endpoints

topdev

DataLoader

Bởi vì các GraphQLquery kết nối với nhau như mạng lưới, một query cũng có khả năng kích hoạt hàng loạt các database call khiến cho performance bị giảm mạnh do lag spike.

Để tránh trường hợp đó, bạn có thể sử dụng những library DataLoader, vốn được phát triển bởi chính Facebook.

Create GraphQL Server

Create GraphQL Server là một command line utility nhằm giúp triển khai nhanh một GraphQLserver nhờ vào Node server và Mongo database.

GraphQL-up

Tương tự như Create GraphQLServer, GraphQL-up cho phép bạn tạo ra GraphQL back-end cực nhanh nhờ vào GraphCool.

GraphQL Services

Cuối cùng, hiện tại đã có một số công ty thuộc dạng chuyên cung cấp “GraphQL-backend” dịch vụ sẽ lo cho bạn phần server nhờ đó mà việc tham gia vào

GraphQLecosystem cũng trở nên đáng để thử hơn.

Graphcool

Một backend platform khá linh hoạt với sự kết hợp giữa GraphQL và AWS Lambda.

topdev

Scaphold

Thêm một dịch vụ GraphQLbackend với nhiều tính năng tương tự như Graphcool.

Resources

Đã có khá nhiều nguồn trên mạng cho bạn thỏa thích dùng

GraphQL.org

Trang web chính chủ của GraphQL với khá nhiều tài liệu hữu ích cho bạn để bắt đầu làm quen với GraphQL.

LearnGraphQL

LearnGraphQL là một khóa học tương tác được tạo bởi các thành viên tại Kadira.

LearnApollo

LearnApollo cũng tương tự như LearnGraphQL và là một khóa dạy học miễn phí được tạo ra bởi Graphcool.

The Apollo Blog

The Apollo blog có hàng ngàn tư liệu và bài viết kĩ lưỡng về Apollo cũng như GraphQL.

GraphQL Weekly

Một newsletter về GraphQL được sưu tập bởi Graphcool team.

topdev

Sau khi đã trang bị cho mình những kiến thức về GraphQL thì bạn sẽ dùng chúng như thế nào? Hãy thử một số combo sau:

Apollo + Graphcool + Next.js

Nếu bạn đã làm quen với Next.js và React, ví dụ sau sẽ cho phép bạn set up một GraphQLendpoint nhờ vào Graphcool rồi query nó nhờ vào Apollo.

VulcanJS

Vulcan tutorial sẽ hướng dẫn bạn cách tạo ra một GraphQLdata layer đơn giản, trên cả server và client. Do Vulcan là một all-in-one platform, cách tốt nhất là bắt đầu từ số 0. Nếu bạn cần sự giúp đỡ thì đừng ngại gì mà hãy vào đây.

GraphQL & React Tutorial

Chroma blog bao gồm 6 phần hướng dẫn cách tạo ra một React/GraphQL app dựa trên cách tiếp cận phát triển theo từng thành phần.

topdev

Nó có vẻ sẽ khá phức tạp khi bạn mới nhìn vào bởi nó là một kĩ thuật dựa trên nhiều lĩnh vực khác nhau của công nghệ hiện đại. Tuy nhiên, nếu bạn kiên tri học hỏi thì tôi tin rằng bạn sẽ hiểu được nó một cách tường tận.

Vì thế cho dù bạn có dùng nó hay không thì cũng đều đáng bỏ thời gian ra để làm quen với nó. Hiện nay, càng ngày càng có nhiều công ty và framework sử dụng nó, rất có thể chắc hẳn nó sẽ trở thành một phần không thể thiếu cho các web developer trong tương lai.

Bài viết gốc tại: medium

Có thể bạn muốn xem thêm:

Xem thêm Top Việc làm web Developer trên TopDev

[Hot] 515 khóa học Programming & Computer Science miễn phí nên bắt đầu ngay bây giờ! (phần 1)

515 khóa học Programming & Computer Science miễn phí

Nếu cách đây 5 năm, chỉ có 1 số trường ĐH lớn như MIT và Standard mở những khóa học online miễn phí cho cộng đồng thì hiện nay, đã có hơn 700 trường trên thế giới mở hàng ngàn khóa học free.

Dưới đây là 515 khóa học free mà mà bạn nên bắt đầu nghiên cứu ngay bây giờ! Danh sách tinh gọn từ 7000 khóa của Class Central, trên mỗi khóa tôi cũng đều đánh giá chất lượng.

515 khóa được lọc theo 3 cấp độ:

  • Beginner – Mới bắt đầu
  • Intermediate – Trung cấp
  • Advanced – Cao cấp

BEGINNER (81)

  1. An Introduction to Interactive Programming in Python (Part 1) – Rice University via Coursera
  2. Programming for Everybody (Getting Started with Python) – University of Michigan via Coursera
  3. Introduction to Computer Science – Harvard University via edX
  4. Intro to Computer Science – University of Virginia via Udacity
  5. Introduction to Programming with MATLAB – Vanderbilt University via Coursera
  6. An Introduction to Interactive Programming in Python (Part 2) – Rice University via Coursera
  7. Introduction to HTML5 – University of Michigan via Coursera
  8. Learn to Program: Crafting Quality Code – University of Toronto via Coursera
  9. Programming Foundations with JavaScript, HTML and CSS – Duke University via Coursera
  10. Introduction to CSS3 – University of Michigan via Coursera
  11. Usable Security – University of Maryland, College Park via Coursera
  12. Introduction to Web Development – University of California, Davis via Coursera
  13. Learn to Program: The Fundamentals – University of Toronto via Coursera
  14. Build a Modern Computer from First Principles: From Nand to Tetris (Project-Centered Course) – Hebrew University of Jerusalem via Coursera
  15. Internet History, Technology, and Security – University of Michigan via Coursera
  16. Creative Programming for Digital Media & Mobile Apps – University of London International Programmes via Coursera
  17. How To Create a Website in a Weekend! (Project-Centered Course) – State University of New York via Coursera
  18. HTML, CSS, and Javascript for Web Developers – Johns Hopkins University via Coursera
  19. Introduction to the Internet of Things and Embedded Systems – University of California, Irvine via Coursera
  20. Ruby on Rails: An Introduction – Johns Hopkins University via Coursera
  21. Introduction to Cyber Security – The Open University via FutureLearn
  22. Cyber Security: Protecting Yourself and Your Data – IEEE via edX
  23. HTML, CSS and JavaScript – The Hong Kong University of Science and Technology via Coursera
  24. Python Programming: A Concise Introduction – Wesleyan University via Coursera
  25. CODAPPS: Coding mobile apps for entrepreneurs – EMLYON Business School via Coursera
  26. How to Code: Simple Data – The University of British Columbia via edX
  27. Intro to Java Programming – San Jose State University via Udacity
  28. DB: Introduction to Databases – Stanford University via Stanford OpenEdx
  29. Programming Foundations with Python – via Udacity
  30. Intro to HTML and CSS – via Udacity
  31. JavaScript Basics – via Udacity
  32. How to Use Git and GitHub – via Udacity
  33. Intro to Relational Databases – via Udacity
  34. Networking: Introduction to Computer Networking – Stanford University via Stanford OpenEdx
  35. CS101: Computer Science 101 – Stanford University via Stanford OpenEdx
  36. MyCS: Computer Science for Beginners – Harvey Mudd College via edX
  37. Learn Swift Programming Syntax – via Udacity
  38. Linux Command Line Basics – via Udacity
  39. Introduction to VBA/Excel Programming – Cal Poly Pomona via Open Education by Blackboard
  40. Computing: Art, Magic, Science – ETH Zurich via edX
  41. Computing: Art, Magic, Science — Part II – ETH Zurich via edX
  42. Learn to Program Using Python – University of Texas Arlington via edX
  43. Introduction to jQuery – Microsoft via edX
  44. Introduction to Linux – Linux Foundation via edX
  45. Object-Oriented Programming – Indian Institute of Technology Bombay via edX
  46. Introduction to Cloud Computing – IEEE via edX
  47. Programming in Scratch – Harvey Mudd College via edX
  48. CS For All: Introduction to Computer Science and Python Programming – Harvey Mudd College via edX
  49. The Computing Technology Inside Your Smartphone – Cornell University via edX
  50. Web Accessibility – Google via Udacity
  51. Mobile Web Development – Google via Udacity
  52. Think. Create. Code – University of Adelaide via edX
  53. Programming Basics – Indian Institute of Technology Bombay via edX
  54. Java Programming Basics – via Udacity
  55. HTML5 Introduction – World Wide Web Consortium (W3C) via edX
  56. HTML5 Part 1: HTML5 Coding Essentials and Best Practices – World Wide Web Consortium (W3C) via edX
  57. AP® Computer Science Principles – Harvard University via edX
  58. Android Basics: Make Your First App – Google via Udacity
  59. Paradigms of Computer Programming — Fundamentals – Université catholique de Louvain via edX
  60. Introduction to Programming with Java 1: Starting to Code with Java – Universidad Carlos iii de Madrid via edX
  61. Web Applications for Everybody – via Independent
  62. Python for Everybody — Exploring Information – via Independent
  63. AP Computer Science A: Java Programming Data Structures and Loops – Purdue University via edX
  64. Java Programming for GCSE and A-Level – University of Wolverhampton via Canvas Network
  65. Introduction to Programming with Java 2: Writing Good Code – Universidad Carlos iii de Madrid via edX
  66. CSS Introduction – Microsoft via edX
  67. Paradigms of Computer Programming — Abstraction and Concurrency – Université catholique de Louvain via edX
  68. Swift for Beginners – via Udacity
  69. Android for Beginners – via Udacity
  70. Introduction to R – via Datacamp
  71. Intro to Python for Data Science – via Datacamp
  72. Java Fundamentals for Android Development – Galileo University via edX
  73. Intro to JavaScript – via Udacity
  74. Introduction to Computing using Python – Georgia Institute of Technology via edX
  75. Object-Oriented Programming – Indian Institute of Technology Bombay via edX
  76. Programming Basics – Indian Institute of Technology Bombay via edX
  77. Android App Development for Beginners – Galileo University via edX
  78. Introduction to Linux – Linux Foundation via edX
  79. Introduction to jQuery – Microsoft via edX
  80. Introduction to Bootstrap — A Tutorial – Microsoft via edX
  81. Introduction to HTML and Javascript – Microsoft via edX

INTERMEDIATE(333)

  1. Machine Learning – Stanford University via Coursera
  2. Programming Languages, Part A- University of Washington via Coursera
  3. Python Data Structures – University of Michigan via Coursera
  4. Using Python to Access Web Data – University of Michigan via Coursera
  5. Using Databases with Python – University of Michigan via Coursera
  6. Introduction to Big Data – University of California, San Diego via Coursera
  7. Principles of Computing (Part 1) – Rice University via Coursera
  8. Principles of Computing (Part 2) – Rice University via Coursera
  9. A Crash Course in Data Science  – Johns Hopkins University via Coursera
  10. R Programming – Johns Hopkins University via Coursera
  11. The Data Scientist’s Toolbox – Johns Hopkins University via Coursera
  12. Getting and Cleaning Data – Johns Hopkins University via Coursera
  13. Exploratory Data Analysis – Johns Hopkins University via Coursera
  14. Practical Machine Learning – Johns Hopkins University via Coursera
  15. Object Oriented Programming in Java – University of California, San Diego via Coursera
  16. Hadoop Platform and Application Framework – University of California, San Diego via Coursera
  17. Concurrent Programming in Erlang – University of Kent via FutureLearn
  18. Statistical Inference  – Johns Hopkins University via Coursera
  19. Regression Models – Johns Hopkins University via Coursera
  20. Reproducible Research – Johns Hopkins University via Coursera
  21. Algorithmic Toolbox – University of California, San Diego via Coursera
  22. Data Science in Real Life – Johns Hopkins University via Coursera
  23. Algorithmic Thinking (Part 1) – Rice University via Coursera
  24. Software Security – University of Maryland, College Park via Coursera
  25. Responsive Web Design – University of London International Programmes via Coursera
  26. Advanced Styling with Responsive Design – University of Michigan via Coursera
  27. Data Visualization and Communication with Tableau – Duke University via Coursera
  28. Java Programming: Solving Problems with Software – Duke University via Coursera
  29. AngularJS: Advanced Framework Techniques – Microsoft via edX
  30. Introduction to DevOps – Microsoft via edX
  31. C++ For C Programmers, Part B – University of California, Santa Cruz via Coursera
  32. Android App Components — Intents, Activities, and Broadcast Receivers – Vanderbilt University via Coursera
  33. Global Warming II: Create Your Own Models in Python – The University of Chicago via Coursera
  34. Testing with Agile – University of Virginia via Coursera
  35. Google Cloud Platform Fundamentals: Core Infrastructure – Google via Coursera
  36. Introduction to Meteor.js Development – University of London International Programmes via Coursera
  37. Programming Languages, Part B – University of Washington via Coursera
  38. A developer’s guide to the Internet of Things (IoT) – IBM via Coursera
  39. Building Data Visualization Tools – Johns Hopkins University via Coursera
  40. Running Product Design Sprints – University of Virginia via Coursera
  41. Internet of Things for Active Aging – Taipei Medical University via FutureLearn
  42. Responsive Website Tutorial and Examples – University of London International Programmes via Coursera
  43. Introduction to Neurohacking In R – Johns Hopkins University via Coursera
  44. Database Management Essentials – University of Colorado System via Coursera
  45. iOS App Development Basics – University of Toronto via Coursera
  46. Fundamentals of Visualization with Tableau – University of California, Davis via Coursera
  47. Cybersecurity and Mobility – University System of Georgia via Coursera
  48. Cloud Computing Applications, Part 1: Cloud Systems and Infrastructure – University of Illinois at Urbana-Champaign via Coursera
  49. Data Structures – University of California, San Diego via Coursera
  50. Server-side Development with NodeJS – The Hong Kong University of Science and Technology via Coursera
  51. Building R Packages – Johns Hopkins University via Coursera
  52. Front-End JavaScript Frameworks: AngularJS – The Hong Kong University of Science and Technology via Coursera
  53. The R Programming Environment – Johns Hopkins University via Coursera
  54. Big Data Integration and Processing – University of California, San Diego via Coursera
  55. Android App Components — Services, Local IPC, and Content Providers – Vanderbilt University via Coursera
  56. Data Science Math Skills – Duke University via Coursera
  57. Java Programming: Arrays, Lists, and Structured Data – Duke University via Coursera
  58. Algorithmic Thinking (Part 2) – Rice University via Coursera
  59. Introduction to Architecting Smart IoT Devices – EIT Digital via Coursera
  60. Internet of Things: Communication Technologies – University of California, San Diego via Coursera
  61. Fundamentals of Computer Architecture – EIT Digital via Coursera
  62. Interactivity with JavaScript – University of Michigan via Coursera
  63. Advanced R Programming – Johns Hopkins University via Coursera

Chi tiết xem Nguồn medium

Bí kíp tạo ra một tokenizer về toán học bằng Javascript

Hồi trước, tôi đã rất hứng thú với việc viết ra một app chuyên giải các vấn đề liên quan tới toán học. Tôi cũng học được rằng mình phải phân tích cú pháp, yêu cầu thành một Cây cú pháp trừu tượng (abstract syntax tree). Vì vậy mà một bản thử đã được tạo ra bằng Javascript. Trong quá trình làm việc, tôi nhận ra rằng tokenizer cần phải được làm ra trước tiên. Vì thế mà hôm nay tôi sẽ chỉ bạn cách làm nó (Thấy có vẻ khó vậy thôi nhưng nó dễ lắm!)

Tokenizer là cái gì vậy?

Tokenizer  là một chương trình chuyện phân chia một yêu cầu, hiển thị (expression) thành nhiều unit nhỏ gọi là Token. Nếu giờ tôi tự nói mình là “Thằng developer mập béo ụ” thì ta có thể sử dụng tokenizer theo nhiều cách sau:

Sử dụng từ ngữ giống như token:

 

0 => I’m
1 => a
2 => big
3 => fat
4 => developer

Sử dụng chữ cái làm token:

0 => I
1 => ‘
2 => m
3 => a
4 => b
…
16 => p
17 => e
18 => r

 

Hoặc là bao gồm luôn cả những kí hiệu khác như dấu phẩy, chấm và khoảng cách space:

0 => I
1 => ‘
2 => m
3 => (space)
4 => a
5 => (space)
6 => b
…
20 => p
21 => e
22 => r

 

Bạn hiểu rồi đúng không?

Tokenizers (còn gọi là lexer) được dùng cho việc phát triển của compiler cho ngôn ngữ lập trình. Nó giúp cho compiler tạo ra được những cấu trúc dựa theo những gì chúng ta muốn. Trong bài viết này thì đó là về cách biểu thị những thuật toán.

Tuyển dụng Javascript lương cao

Tokens

Một biểu thị thuật toán tốt bao gồm các token của thuật toán, mà trong project này thì sẽ là Literals, Variables, Operators hoặc Functions.

Một số điều cần lưu ý:

  • Literal là một cái tên khá hoa mỹ cho một con số (trong ví dụ này). ta sẽ chỉ cho phép số ở dạng toàn bộ hoặc thập phân.
  • Variable chính là các ẩn biến ta hay dùng trong toán: x,y,z,b,c. Cho project này, thì tất cả các variable sẽ chỉ hiện thị một chữ cái thôi. Đây cũng là cách để ta có thể token một biểu thị như ma là kết quả kết hợp từ hai variable m và a.
  • Operator hoạt động trên Literal và Variable cũng như là kết quả của function. Chúng ta sẽ cho phép những operator +, -, *, /, và ^.
  • Function giống như là phiên bản cao cấp của Operator. Nó bao gồm sin(), cos(), tan(), min(), max(), etc.

Ta cũng sẽ thêm vào 2 token vốn thường không được cho là token nhưng sẽ giúp ta dễ hơn trong việc quan sát: Left Right Parentheses.

Một số điều cần lưu ý

Phép nhân ngầm (Implicit Multiplication)

Implicit multiplication đơn giản là cho phép người viết rút ngắn cách ghi ra phép tính nhân, 5x thay vì 5*x. Đi xa hơn nữa, nó cũng cho phép với những function như (5sin(x) = 5*sin(x)).

 

Không chỉ thế, 5(x) và 5(sin(x)) cũng đều làm được. Tất cả đều tùy vào chúng ta có cho phép nó hay không thôi. Vậy thì có bất lợi gì không? Việc không dùng nó thật ra lại giúp quá trình tokenize diễn ra nhanh hơn cũng như cho phép variable có tên với nhiều kí tự hơn (những cái tên như price) Còn nếu bạn cho phép thì sẽ giúp platform dễ nhìn hơn cho người dùng, cho thêm thách thức để bạn chứng minh bản lĩnh. Tôi thì sẽ cho phép nó.

Syntax

Mặc dù chúng ta không phải là đang tạo ra một ngôn ngữ lập trình mới, nhưng cũng phải có một vài rules qui định cho các biểu thị đúng, để người dùng biết phải điền vào như thế nào mà ta cũng biết cái gì cần để lên kế hoạch. Nói chính xác hơn, các token toán học phải được kết hợp dựa theo những qui tắc của thuật toán để đưa ra những biểu thị đúng. Sau đây là những qui tắc của tôi:

Token có thể được chia cắt bởi o hoặc dùng khoảng trống space nhiều lần.

2+3, 2 +3, 2 + 3, 2 + 3 are all OK 
5 x - 22, 5x-22, 5x- 22 are all OK

 

Nói cách khác, khoảng cách không quan trọng.

Các hàm function sẽ phải được đặt trong ngoặc đơn (sin(y), cos(45), chứ không phải sin y, cos 45) (Tại sao? chúng ta sẽ lược bỏ tất cả các dấu space ra khỏi string vì thế mà bạn sẽ muốn thấy được khi nào hàm bắt đầu và kết thúc)

Phép nhân ngầm chỉ được dùng giữa Literals Variables hoặc Literals Functions, theo đúng thứ tự đó (Literal luôn được ưu tiên trước) và được quyền có hoặc không ngoặc đơn. Điều đó cũng có nghĩa:

  • a(4) sẽ được xem là một hàm – function hơn là a*4
  • a4 không được cho phép
  • 4a và 4(a) thì lại được

Giờ thì thử thực hành cái nào!

Đầu tiên ta sẽ bắt đầu với cơ bản trước với ví dụ này: 2y + 1

Để biểu thị dãi trên trong một array với các token sẽ như thế này:

0 => Literal (2)
1 => Variable (y)
2 => Operator (+)
3 => Literal (1)

 

Trước tiên, ta sẽ xác định một token class để cho nó dễ:

 

function Token(type, value) {
   this.type = type;
   this.value = value
}

Algorithm – Thuật toán

Giờ thì tới phần khung xương cho chức năng của tokenizer.

Tokenizer của chúng ta sẽ đi qua từng kí tự của str array và tạo ra token dựa trên những gì nó thu thập được.

[Ta sẽ tự cho là người dùng đã đưa những bài toán và biểu thị đúng nên việc sử dụng hình thức xác nhận sẽ không cần đưa vào trong xuyên suốt project này]

function tokenize(str) {
  var result=[]; //array of tokens
  
  // remove spaces; remember they don't matter?
  str.replace(/\s+/g, "");
  // convert to array of characters
  str=str.split("");
  str.forEach(function (char, idx) {
    if(isDigit(char)) {
      result.push(new Token("Literal", char));
    } else if (isLetter(char)) {
      result.push(new Token("Variable", char));
    } else if (isOperator(char)) {
      result.push(new Token("Operator", char));
    } else if (isLeftParenthesis(char)) {
      result.push(new Token("Left Parenthesis", char));
    } else if (isRightParenthesis(char)) {
      result.push(new Token("Right Parenthesis", char));
    }
  });
  return result;
}

 

Đoạn code trên rất là cơ bản. Những helper như isDigit() , isLetter(), isOperator(), isLeftParenthesis(), and isRightParenthesis() sẽ được

function isDigit(ch) {
 return /\d/.test(ch);
}
function isLetter(ch) {
 return /[a-z]/i.test(ch);
}
function isOperator(ch) {
 return /\+|-|\*|\/|\^/.test(ch);
}
function isLeftParenthesis(ch) {
 return /\(/.test(ch);
}
function isRightParenthesis(ch) {
 return /\)/.test(ch);
}

 

[Bạn có thể thấy không hề có isFunction(), isLiteral() hoặc isVariable() functions bởi chúng ta sẽ kiểm tra các character từng đứa một]

Và giờ đây parser của chúng ta đã thật sự hoạt động. Hãy thử tất cả những phép tính sau: 2 + 3, 4a + 1, 5x+ (2y), 11 + sin(20.4).

Tất cả đều chạy tốt?

Không hẳng.

Bạn sẽ thấy với phép tính cuối, 11 sẽ được báo là 2 Literal tokens chứ không phải 1. Ngoài ra sin cũng được báo là có 3 token chứ không phải 1. Tại sao?

đó vì khi tokenize, một số token có nhiều kí tự. Literals có thể là 5, 7.9, .5 trong khi Functions thì là sin, cos etc. Variables thì mặc dù chỉ được hiện dùng 1 kí tự nhưng lại là chuyện hoàn toàn khác trong implicit multiplication. Vậy làm cách nào để sửa nó?

Buffers

Bằng cách dùng một buffer ta có thể giải quyết những vấn đề này. Và trong ví dụ thì trên ta sẽ cần đến 2. một buffer sẽ dùng cho các kí tự của Literal (số và dấu thập phân), và một cái khác cho chữ cái (bao gồm cho cả variables và functions).

Buffer hoạt động như thế nào? Khi tokenizer gặp một số/dấu thập phân hoặc chữ cái, nó sẽ đặt chúng vào buffer thích hợp và quá trình đó lặp đi lặp lại cho đến khi nó tiến vào một operator hoàn toàn khác. Đồng thời hành động của tokenizer cũng thay đổi tùy vào từng operator.

Đối với một phép toán sau 456.7xy + 6sin(7.04x), thì ta sẽ có được như dưới đây:

read 4 => numberBuffer
 read 5 => numberBuffer
 read 6 => numberBuffer
 read . => numberBuffer
 read 7 => numberBuffer
 x is a letter, so put all the contents of numberbuffer together as a Literal 456.7 => result
 read x => letterBuffer
 read y => letterBuffer
 + is an Operator, so remove all the contents of letterbuffer separately as Variables x => result, y => result
 + => result
 read 6 => numberBuffer
 s is a letter, so put all the contents of numberbuffer together as a Literal 6 => result
 read s => letterBuffer
 read i => letterBuffer
 read n => letterBuffer
 ( is a Left Parenthesis, so put all the contents of letterbuffer together as a function sin => result
 read 7 => numberBuffer
 read . => numberBuffer
 read 0 => numberBuffer
 read 4 => numberBuffer
 x is a letter, so put all the contents of numberbuffer together as a Literal 7.04 => result
 read x => letterBuffer
 ) is a Right Parenthesis, so remove all the contents of letterbuffer separately as Variables x => result

 

Hoàn tất. Giờ thì bạn đã hiểu được rồi đúng không?

Đây là lúc mà bạn sẽ phải suy nghĩ kĩ về thuật toán và mô hình hóa dữ liệu

của mình. Sẽ có chuyện gì xảy ra nếu kí tự hiện tại lại là một operator, và Buffer cho số lại không empty? Liệu cả 2 buffer đều có thể cùng lúc /lần lượt không empty không?

Từ đó chúng ta sẽ rút ra được kết quả sau (giá trị ở bên trái của mũi tên miêu tả kí tự/nhân vật hiện tại của chúng ta (ch), NB=numberbuffer, LB=letterbuffer, LP=left parenthesis, RP=right parenthesis)

loop through the array:
  what type is ch?
  digit => push ch to NB
  decimal point => push ch to NB
  letter => join NB contents as one Literal and push to result, then push ch to LB
  operator => join NB contents as one Literal and push to result OR push LB contents separately as Variables, then push ch to result
  LP => join LB contents as one Function and push to result OR (join NB contents as one Literal and push to result, push Operator * to result), then push ch to result
  RP => join NB contents as one Literal and push to result OR push LB contents separately as Variables, then push ch to result
end loop
join NB contents as one Literal and push to result OR push LB contents separately as Variables,

2 điều cần lưu ý

  • Bạn có thấy tôi đã thêm vào “push Operator * to result” không? Đó là cách chúng ta chuyển đổi phép nhân ẩn thành phép nhân rõ ràng. Và khi làm trống nội dung của các LB riêng biệt như Variable, ta cần phải chèn multiplication Operator vào giữa chúng.
  • Tại cuối function loop, ta cũng phải làm trống tất cả những gì còn sót lại trong buffer.

Giờ thì chuyển nó thành code thôi!

Tổng hợp lại tất cả, tokenize function của bạn sẽ nhìn như thế này:

function Token(type, value) {
   this.type = type;
   this.value = value;
}

function isDigit(ch) {
 return /\d/.test(ch);
}

function isLetter(ch) {
 return /[a-z]/i.test(ch);
}

function isOperator(ch) {
 return /\+|-|\*|\/|\^/.test(ch);
}

function isLeftParenthesis(ch) {
 return /\(/.test(ch);
}

function isRightParenthesis(ch) {
 return /\)/.test(ch);
}

function tokenize(str) {
  str.replace(/\s+/g, "");
  str=str.split("");
  
  var result=[];
  var letterBuffer=[];
  var numberBuffer=[];
  
str.forEach(function (char, idx) {
    if(isDigit(char)) {
      numberBuffer.push(char);
    } else if(char==".") {
      numberBuffer.push(char);
    } else if (isLetter(char)) {
      if(numberBuffer.length) {
        emptyNumberBufferAsLiteral();
        result.push(new Token("Operator", "*"));
      }
      letterBuffer.push(char);
    } else if (isOperator(char)) {
      if(numberBuffer.length) {
        emptyNumberBufferAsLiteral();
      }
      if(letterBuffer.length) {
        emptyLetterBufferAsVariables();
      }
      result.push(new Token("Operator", char));
    } else if (isLeftParenthesis(char)) {
      if(letterBuffer.length) {
        result.push(new Token("Function", letterBuffer.join("")));
        letterBuffer=[];
      } else if(numberBuffer.length) {
        emptyNumberBufferAsLiteral();
        result.push(new Token("Operator", "*"));
      }
      result.push(new Token("Left Parenthesis", char));
    } else if (isRightParenthesis(char)) {
      if(letterBuffer.length) {
        emptyLetterBufferAsVariables();
      } else if (numberBuffer.length) {
        emptyNumberBufferAsLiteral();
      }
      result.push(new Token("Right Parenthesis", char));
    }
  });
  if (numberBuffer.length) {
    emptyNumberBufferAsLiteral();
  }
  if(letterBuffer.length) {
    emptyLetterBufferAsVariables();
 }
 return result;
 
 function emptyLetterBufferAsVariables() {
        var l = letterBuffer.length;
        for (var i = 0; i < l; i++) {
          result.push(new Token("Variable", letterBuffer[i]));
          if(i< l-1) { //there are more Variables left
            result.push(new Token("Operator", "*"));
          }
        }
        letterBuffer = [];
 }
 
 function emptyNumberBufferAsLiteral() {
   result.push(new Token("Literal", numberBuffer.join("")));
   numberBuffer=[];
 }
 
}

var tokens = tokenize("89sin(45) + 2.2x/7");
tokens.forEach(function(token, index) {
  console.log(index + " => " + token.type + "(" + token.value + ")");
});

Thấy chưa? Nó hoạt động rồi đấy!

Tổng kết

Đến giờ phút này thì là lúc bạn sẽ phân tích function của mình và xem nó làm những gì so với những gì bạn muốn. Hãy luôn tự hỏi bản thân, “Liệu nó có hoạt động đúng như mục tiêu đặt ra không?” và “Liệu mình đã dự đoán hết trường hợp có thể xảy ra chưa?”

Tiếp theo bạn sẽ phải chạy nhiều bài test khác nhau cho function. Nếu bạn thấy hài lòng với kết quả thì mới bắt đầu suy nghĩ về hướng cải thiện nó thêm.

Nguồn: topdev.vn via Medium

Tuyển dụng IT đãi ngộ tốt trên TopDev

Hiểu Mobile Dev sợ gì để giành vé VIP dự sự kiện công nghệ!

Trào lưu “Chị làm/chị ở… nhưng không dám nói, chị sợ…” vẫn chưa giảm nhiệt suốt thời gian qua trong cộng đồng mạng!

Vậy tại sao không tận dụng cơ hội này đưa trí tưởng tượng bay cao bay xa hơn, để giành lấy những chiếc vé tham dự Ngày Hội Di Động Toàn Quốc – Vietnam Mobile Day sắp tới?

Luật chơi

  • Comment vế sau của bức ảnh => càng bựa, càng chất, càng ra dáng dev càng tốt vì sẽ ảnh hưởng đến khả năng “giật” giải của bạn!
  • Like bài post này & share public https://www.facebook.com/topdevvietnam/posts/1271236786258782/
  • Danh sách trúng giải sẽ được ước tính theo SỐ LƯỢT LIKE COMMENT tính từ trên xuống

Thời gian chơi

20h tối ngày 25/04/2017 đến 11h sáng ngày 03/05/2017

Giải thưởng

  • 1 giải đặc biệt – 1 VÉ VIP tham dự Vietnam Mobile Day 2017 trị giá 1.000.000 VNĐ
  • 2 giải nhất – Mỗi giải 1 VÉ STANDARD tham dự Vietnam Mobile Day 2017 trị giá 250.000 VNĐ/ vé
  • 10 giải nhì – Mỗi giải 1 MÃ CODE GIẢM GIÁ 50%/ vé Standard tham dự Vietnam Mobile Day 2017
  • 40 giải ba – Mỗi giải 1 MÃ CODE GIẢM GIÁ 50.000 VNĐ/ vé Standard tham dự Vietnam Mobile Day 2017

SÁNG TÁC ẢNH – RINH QUÀ KHỦNG ngay thôi!

  • Thời gian & địa điểm:
    – 20/05/2017 tại Trung tâm Hội nghị 272 Võ Thị Sáu, Q.3, Tp.HCM
    – 27/05/2017 tại Trung tâm Hội nghị Forevermark, 614 Lạc Long Quân, Q. Tây Hồ, Hà Nội
    – 03/06/2017 tại OneOpera Hotel, 115 Nguyễn Văn Linh, Q.Hải Châu, Tp. Đà Nẵng
  • Website: http://mobileday.vn
  • Thông tin hợp tác:
    Ms. Ngọc Đỗ
    Điện thoại: 08 6273 3497 | 0944 685 243
    Email: ngoc.do@applancer.net

5 bài học từ việc phát triển app cho web

Lần đầu tiên tôi viết ra được một app dành cho web là khi làm cho project cuối khóa khi còn học đại học. Thay vì phát triển ra một ứng dụng chỉ để hoàn thành project, tôi quyết định tạo ra một app mang tính thực tiễn, có thể áp dụng vào đời sống luôn. Thế là  Cyber Manager, một hệ thống quản lí online cho các quán cyber cafe, được ra đời. Chỉ trong năm 2011, có tới hơn 3,000 lượt download kể từ khi tôi up nó lên SourceForge.net. Trong bài viết này, tôi sẽ kể cho bạn 5 bài học tôi rút ra được trong quá trình tạo ra Cyber Manager, hi vọng sẽ giúp bạn trên con đường lập trình app cho web.

Bài học 1: Đừng kiếm ý tưởng cho project. Hãy kiếm vấn đề để giải quyết

Nếu bạn muốn thử sức với việc viết ra một web app, thay vì cứ tìm kiếm ý tưởng “độc” để phát triển, hãy nghĩ về vấn đề cần được giải quyết. Một vấn đề từ thế giới thật sẽ đặt ra thử thách cho bạn cũng như mở ra cơ hội để mở rộng những kĩ năng của mình và trở nên thật chuyên nghiệp. Nó cũng sẽ giúp ích bạn trong quá trình kiếm việc bởi những kinh nghiệm từ việc coding giải quyết những vấn đề trong thế giới thực. Hơn nữa, bạn cũng sẽ hiểu rõ hơn về code.  

Bài học 2: Giải pháp luôn đến từ xung quanh bạn.

Khi tôi vẫn còn ở đại học, tôi thường ghé quán cyber cafe của một người bạn để học về lập trình web qua các khóa online. Có lúc, tôi dành tới hàng tiếng mỗi ngày, vài ngày mỗi tuần chỉ ở quán cafe. Tất nhiên, là tôi cũng phụ bạn quản lí quán khi anh ta nghỉ ngơi. Nhờ đó mà ý tưởng về cyber manager xuất hiện.

Bài học 3: Lựa chọn phương pháp phát triển dựa vào open source tool.

Sau khi đã quyết định bạn sẽ làm cái gì, việc tiếp theo là bạn phải tập trung vào cách phát triển project đó.  ASP.NET là một lựa chọn được khá nhiều sinh viên yêu thích, cũng như Java. Riêng tôi thì quyết định dùng PHP, Apache và MySQL, một open source language stack khá nổi tiếng và an toàn. Việc dùng cả 3 tool trên cũng cho tôi thêm kinh nghiệm làm việc với các cộng đồng online.

Bài học 4: người cố vấn, chỉ dạy còn quan trọng hơn cả technology stack.

Khi bạn bắt đầu project của mình, hãy ưu tiên việc kiếm một người thầy, cố vấn giỏi hơn cả technology stack. Công nghệ chỉ là một công cụ để hoàn thành project nhưng thầy cố vấn thì lại giúp hoàn thiện con người bạn – thầy giỏi sẽ khiến bạn làm ra được những ứng dụng tốt, giúp bạn phát triển trở thành một pro IT. Mặc dù nhiều trường đại học hiện nay có dịch vụ cố vấn cho học sinh nhưng bạn cũng nên dựa vào nguồn bên ngoài mà kiếm thêm người chỉ dạy.

Tôi rất may mắn khi được một người bạn làm thầy chỉ dạy khi làm project cho năm cuối. Anh ta là một pro PHP developer và là một entrepreneur. Tôi luôn dành thời gian bàn luận cùng với anh ấy và nhận được rất nhiều lời khuyên quí giá cho việc phát triển project. Anh cũng theo sát quá trình phát triển và luôn chạy test app để tìm ra bug cũng như vấn đề hiệu năng. Nhờ đó mà ứng dụng của tôi được cải thiện lên rất nhiều.

Bài học 5: Hãy để người dùng thật sự test và sử dụng app của bạn.

App chỉ thật sự hoàn thiện khi nó đã được test và dùng bởi nhóm người dùng mà bạn muốn nhắm vào. Để kết quả của một project chính xác, đáng tin cậy thì bạn cần phải thu thập feedback khi cho một nhóm người dùng, thuộc thị trường bạn đang nhắm vào, test sản phẩm của mình. Đây là điều vô cùng quan trọng bởi nó cải thiện chất lượng của app cũng như đóng vai trò then chốt cho sự phát triển của một project cũng như sản phẩm mà người dùng yêu thích nó.

Hãy xem sản phẩm app của tôi – Cyber manager:

Cyber Manager là một hệ thống quản lí web-based dành cho cyber cafe được tạo ra nhờ vào PHP/MySQL.

Cyber Manager

Như bạn thấy trong hình, nó bao gồm 9 section khác nhau:

Quản lí khách hàng: theo dõi quá trình sử dụng của khách hàng thông qua một online database.  Admins có thể add, edit, search, và xóa thông tin lưu trữ về khách hàng.

screenshot of Manage Customer view

Khách hàng Login: Cho phép khách hàng sử dụng một máy tính của quán. Ngay khi người quản lí cho phép khách hàng log/đăng nhập vào một máy tính thì đồng hồ tính giờ cũng sẽ chạy cho đến khi logout bởi người quản lí. Dựa vào tổng thời gian xài máy tính mà người quản lí sẽ tính bill cho khách hàng.

customer login module view

Quản lí bill/invoice: Tự động tính và tạo ra bill cho khách hàng. Số tiền sẽ được dựa theo số thời gian sử dụng máy tính cũng như khách hàng dùng thêm các dịch vụ khác. Ngoài ra nó còn lưu trữ các bill nhằm phục vụ cho việc kiểm tra để quản lí.

manage bills

Quản lí dịch vụ: Thêm, sửa hoặc xóa các dịch vụ có trong quán. Người quản lí có thể in ra một bản list những dịch vụ và giá thành của chúng.

manage services

Print Rate Card: In thẻ giá service có ghi rõ các loại service cũng như giá của nó.

Xem thẻ khách hàng: tạo và xem membership của khách hàng bao gồm tên, ngày sinh, ID và ngày hết hạn.

customer membership card

Thông báo membership hết hạn: List các khách hàng có ID card hết hạn và không được phép sử dụng dịch vụ của quán. Người quản lí cũng được quyền gửi email để thông báo cho người dùng về vấn đề trên để mở lại tài khoản hoặc thêm thời gian.

expired memberships

Nguồn: blog.topdev.vn via Opensource

11 Kiểu Lập Trình Viên trên trái đất bạn là ai?

10021003 1004 1005 1006 1007 1008 1009 1010 1011 1012

Nguồn: Techtalk via Techinasia

Tham khảo việc làm GIT lương cao tại TopDev

Các công cụ giúp tăng tốc workflow và làm việc năng suất hơn

tăng tốc workflow cho developer

Tác giả:  Egwuenu Gift

Hầu như mọi developer làm việc với những tool khác nhau hàng ngày để giúp họ đạt được mục tiêu và hoàn thành task của mình. Ở bài viết này, mình sẽ giới thiệu các tool mình sử dụng để tăng tốc workflow cho developer. Nhưng trước hết mình muốn giải thích workflow là gì đã.

Workflow là gì?

Workflow là một chuỗi các event hay các task xử lý một set data. Workflow có ở bất cứ đâu từ kinh doanh đến ngành công nghiệp. Chúng là lộ trình mô tả chính xác cách mà một vài công việc từ lúc bắt đầu đến lúc kết thúc, hoặc xử lý như thế nào.

Đây là một ví dụ: Mình có workflow viết bài. Mình bắt đầu tìm ý tưởng cho bài viết. Tiếp đó, mình lên dàn ý. Sau đó viết nội dung thực tế để publish tất cả sự kiện này để hoàn thành công việc.

Là một developer, mình có xu hướng tận dụng những tool có sẵn có thể giúp mình tăng tốc quá trình hoàn thành công việc. Mặc dù rất nhiều quá trình có thể sẽ khác với mọi người, mình vẫn cảm thấy nên chia sẻ nó đến các bạn. Sau cùng thì không có kiến thức nào là dư thừa cả mà phải không các bạn?

Tool tăng tốc workflow cho developer

Vì danh sách này khá nhiều nên mình sẽ cố gắng chia theo từng hạng mục khác nhau, mình sẽ chú ý những tool sử dụng cho code, viết và những tool khác mình nghĩ bạn sẽ thấy có ích.

  8 tools cần có để tăng workflow khi lập trình web

Coding Tools

GitKraken

Trang chủ GitKraken

Mình tìm được công cụ này từ một người bạn và mình thật sự thích sử dụng nó. Mình là một fan bự của sử dụng các dòng lệnh bằng GUI nhưng công cụ này thì khác hơn nhiều. GitKranken là một dụng con của GitHub hoạt động giống như những dòng lệnh bạn đã quen nhưng với UX/UI trực quan tạo ra trải nghiệm tuyệt vời khi bạn sử dụng.

Insomnia

Trang chủ Insomnia

Đây là một tool nữa mình rất thích sử dụng. Nó tương tự với Postman nhưng cũng cho phép bạn truy vấn endpoint của GraphQL của bạn rất tuyệt vời. Insomnia là một công cụ GraphQL và HTTP mạnh mẽ có sẵn trên các nền tảng Mac, Linux và Windows. Các tính năng của nó bao gồm hỗ trợ GraphQL, SVG và xem trước hình ảnh, xác thực AWS,…

Visual Studio Code

Trang chủ của Visual Studio Code

Visual Studio Code là một công cụ soạn code mà mình rất thích sử dụng. Mình đã sử dụng nó được vài năm rồi và mình thấy không có lý do gì để dừng nó. Với những cải tiến liên tục và nhiều tính năng mới được thêm vào thường xuyên, đây là công cụ code hàng đầu với mình.

Dash

Website của Dash

Dash là một ứng dụng của Mac dành cho developer cho phép bạn truy cập hơn 200 tài liệu API offline miễn phí. Bạn có thể tạo tài liệu riêng của mình hoặc thậm chí yêu cầu những tài liệu không có sẵn. Đối với người sử dụng Windows, có một bản thay thế cho app này là Zeal App.

SourceTree

Trang chủ của Sourcetree

Bạn đã bao giờ muốn dùng GUI thay vì dòng lệnh cho Git chưa? Nếu vậy thì SourceTree là lựa chọn tốt nhất cho bạn. Mình đã nói về GittKraken và cả 2 có chức năng giống nhau, mình thường dùng thay thế qua lại giữa 2 ứng dụng. Nên mình khuyên là bạn hãy sử dụng những gì tốt nhất cho bạn, và cả 2 cái này đều là những ứng dụng tuyệt vời.

Postico

Trang chủ của Postico

Postico là một ứng dụng con của Postgres. Nó có UI đẹp và dễ truy cập. Mình thích sử dụng cái này hơn những ứng dụng khác mình biết và thậm chí mình còn dùng dòng lệnh Postgres.

Hyper

Trang chủ của Hyper

Hyper là một tool mình rất thích sử dụng. Nó thực sự là thiết bị đầu cuối mặc định để mình code. Hyper dễ tuỳ chỉnh với nhiều plugin để tích hợp vào nó làm cho nó trở nên tuyệt vời hơn.

Tools để viết

Notion

Website của Notion

Notion là một công cụ có hầu hết mọi thứ bạn cần. Mình chưa gặp ai mà lại không thích tool này cả. Nó thực sự hữu ích. Bạn có thể viết, lên kế hoạch và phối hợp Notion để làm việc. 

Dropbox Paper

Website của Dropbox Paper

Dropbox Paper là một công cụ viết tuyệt vời. Mình thường xuyên dùng nó để viết note, viết post và nhiều thứ khác, Nó hỗ trợ định dạng markdown.

Bear App

Website của Bear

Mình thích sự đa dạng, vì vậy hãy tha lỗi cho mình nếu mình chia sẻ quá nhiều ứng dụng thực hiện các chức năng tương tự nhé. Bear App là một ứng dụng để tạo và viết bất cứ thứ gì. Nó có thể được dùng để viết bài, ghi chú lại, và cũng là một ứng dụng to-do-list.

Caret

Caret là một công cụ chỉnh sửa markdown dành cho người dùng Mac, Windows và Linux. Nó cho phép bạn viết nội dung trong Markdown và cũng cung cấp khá nhiều tính năng hữu ích như dark mode mà mình rất thích.

Công cụ Deploy

Netlify

Website của Netlify

Netlify là một công cụ mình thích dùng để triển khai các ứng dụng của mình. Đây là một nền tảng hợp nhất tự động hoá code của bạn để tạo ra các trang web hiệu suất cao, dễ bảo trì và cả các web app.

GitHub Pages

Website của GitHub Pages

GitHub Pages khá hữu ích khi bạn cần quay một phiên bản web đã triển khai miễn phí. Với một vài bước từ kho git của bạn, bạn sẽ có một website đã triển khai. Mình dùng cái này rất nhiều.

Zapier

Website Zapier

Zapier là một công cụ tự động để tự động hoá hầu như mọi thứ bạn có thể nghĩa ra. Mình sử dụng nó để tự động hoá tweets gửi đi khi mình publish một bài mới bằng cách tạo 1 zap với tài khoản twitter và nguồn cấp RSS của mình.

  Deploy web app với Traefik và Docker Swarm

Một vài tool khác

Rocket

Website của Rocket

Rocket là một emoji kiểu chạm dành cho Mac của bạn. Nó hoạt động như công cụ tìm emoji trong Slack. Nhập một dấu hai chấm khi bạn muốn sử dụng một emoji, gõ tên của nó, bấm enter một lần nữa để chèn. Nó tiện lợi hơn nhiều so với sử dụng bàn phím emoji có sẵn của Mac.

Numi

Trang chủ của Numi

Numi là một ứng dụng tính toán dành cho Mac. Mình phải nói là cái này không chỉ dùng để tính toán bởi vì những tính năng của nó còn nhiều hơn thể nữa. Nó kiểu “blew my mind” khi mình khám phá ra được mình có thể convert hầu như tất cả mọi thứ với nó, ví dụ như chuyển đổi đô-la sang nai-ra, là đơn vị tiền tệ ở chỗ mình.

Taskade

Website của Taskade

Taskade là một ứng dụng với rất nhiều tính năng. Mình sử dụng cái này để làm to-do list, kế hoạch hàng tuần và cũng như viết note. Bên cạnh đó, có rất nhiều thứ có thể làm trong ứng dụng này. Không có gì ngạc nhiên khi nó được cho là một công cụ cộng tác tuyệt vời cho các team Agile.

RecordIT

Website của RecordIT

RecordIT là một ứng dụng để ghi lại màn hình. Mình thấy nó khá hữu ích khi mình cần tạo một demo nhanh hoặc show cách một thứ gì đó hoạt động dưới dạng hình gif.

Aware

Website của Aware

Aware là một ứng dụng của Mac giúp bạn theo dõi được thời lượng bạn sử dụng máy tính của mình. Mình sử dụng nó để biết thời gian mình dành để làm việc hoặc hoàn thành một công việc nào đó.

Kết luận

Mình hy vọng bạn sẽ thấy danh sách các tool dành cho developer của mình có ích và bắt đầu sử dụng chúng để làm công việc dễ dàng hơn. Mình thấy rất có ích nếu chia sẻ với các bạn những công cụ này, và mình cũng rất vui nếu các bạn chia sẻ lại với mình những công cụ mà bạn thấy hữu ích nhưng chưa có trong bài viết. Cùng làm việc năng suất nào!!

Bài viết gốc được đăng tải tại medium.freecodecamp

Sẽ là thiếu sót nếu dân theo nghiệp Mobile không biết 7 chủ đề này!

Nhận ra được tiềm năng phát triển của thị trường di động, các nhà kinh doanh, lập trình viên đã không ngừng đưa ra ý tưởng, biến di động thành hệ sinh thái lớn mạnh, trở thành những công cụ phục vụ nhu cầu thực tiễn và có thể thu về lợi nhuận.

Để có thể hiểu rõ hơn về thị trường di động sôi động, 9 chủ đề đầu tiên của Vietnam Mobile Day vừa tập trung vào kinh nghiệm xây dựng kiến trúc, phát triển Mobile app vừa chia sẻ các giải pháp để có thể giảm rủi ro thất bạt của startup/ project IT và dự đoán tiềm năng tương lai của ngành Mobile. Dự đoán những chủ đề dưới đây sẽ “đốt cháy” các khán phòng Vietnam Mobile Day, mang lại những thông tin hữu ích, kiến thức chuyên sâu cho người tham dự!

Chủ đề #1: Quy trình phát triển Mobile app

Sự ra đời của nhiều ứng dụng đã tạo nên sự cạnh tranh gay gắt giữa các cá nhân và doanh nghiệp, đòi hỏi không ngừng phát triển sản phẩm, để tạo nên sự đột phá mới, giúp ứng dụng nổi bật giữa hàng ngàn đối thủ cạnh tranh ngày nay. Tìm kiếm quy trình phát triển Mobile app một cách đúng đắn chắc chắn sẽ tạo ra cú bật cho sản phẩm trong tương lai. Trong đó quy trình phát triển Mobile app thường có những bước căn bản sau:

  • Xác định mục tiêu
  • Tạo wireframe
  • Lập trình back-end và front-end

Khác với lập trình web, khi lập trình di động, bạn chỉ cần biết rõ một ngôn ngữ hoặc Swift hoặc Objective-C hoặc Java hoặc C++. Nền tảng iOS, Android cung cấp rất đầy đủ API, code mẫu, pattern để lập trình viên học và tạo ra app. Tuy nhiên nên nhớ rằng, quy trình duyệt app Apple và Google rất chặt chẽ, tỷ lệ cạnh tranh trên các thư viện app rất cao.

Diễn giả: Phạm Thanh Tú – CTO Agiletech

Chủ đề #2: Giải pháp fullstack cho phát triển Mobile App nhanh nhất và chi phí cơ hội thấp nhất với React ecosystem

Để trở thành một fullstack developer, đòi hỏi người lập trình phải có kiến thức IT tổng quát, không giới hạn bản thân mình ở bất kỳ một language, framework hay specialization nào hết.

React là một library tập trung vào việc giải quyết các vấn đề ở view layer. React khuyến khích việc sử dụng các Javascript API thông thường hơn là những framework abstraction. Nó cung cấp cho developer một ngôn ngữ tạo template và các function nhằm render ra các mã HTML. Một trong các ưu điểm khi sử dụng React đó là áp dụng triệt để các pattern UI và workflow, code UI dễ đọc và bảo trì. Tuy nhiên, song song với các ưu điểm trên, việc chuyển sang hoàn toàn React không hề đơn giản.

Tại Vietnam Mobile Day, với chủ đề Giải pháp fullstack cho phát triển Mobile App nhanh nhất với chi phí cơ hội thấp nhất với hệ sinh thái React, bạn hiểu rõ 3 vấn đề chính sau:

  • Bạn băn khoăn như thế nào là QUY TRÌNH CHUẨN ĐỂ PHÁT TRIỂN MOBILE APP?
  • Bạn chưa biết biết cách tốt ưu phát triển mobile app NHANH HƠN, CHI PHÍ THẤP HƠN?
  • Bạn đang tìm kiếm GIẢI PHÁP FULLSTACK với HỆ SINH THÁI REACT?

Diễn giả: Phạm Thanh Tú – CTO Agiletech

Chủ đề #3: Unidirectional Data Flow Architecture – Kiến trúc Facebook sử dụng để phát triển ứng dụng

Bắt đầu từ một mạng xã hội nhỏ trong nội bộ Đại học Havard, đến nay Facebook đã trở thành một trong những mạng xã hội lớn mạnh nhất trên thế giới.

Trong hội thảo F8, một hội thảo được tổ chức hàng năm của Facebook nhằm giới thiệu những tính năng và công nghệ mới của mình, tổ chức vào cuối tháng 4 – 2014, Tom Occhino – Engineering Manager của Facebook đã chia sẻ rằng mô hình MVC “trở nên cực kỳ phức tạp một cách nhanh chóng”. Đồng thời, Tom cũng đưa ra một nhận xét gây khá nhiều tranh cãi tại thời điểm đó:  “MVC doesn’t scale”. Cuối cùng, trong bài thuyết trình đó, các kỹ sư của Facebook đã giới thiệu một kiến trúc mới, với tên gọi là Flux, mà theo các kỹ sư của Facebook thì Flux sẽ giúp cho lượng code đồ sộ (hơn 9 triệu dòng) của họ trở nên dễ hiểu hơn, thêm chức năng mới dễ dàng hơn, và đặc biệt là “có thể đoán biết được” (predictable).

Cùng tìm hiểu về Flux – Kiến trúc Facebook sử dụng để phát triển ứng dụng tại Vietnam Mobile Day, bạn nhé!

Diễn giả: Hùng Đinh – Senior iOS Developer tại NEOGOV Việt Nam

Chủ đề #4: Modern DevOps workflow to improve developers’ productivity & quality

Ngày nay, quy trình phát triển phần mềm hiện đại góp phần không nhỏ đối với việc tăng năng suất làm việc của các developer, đem lại hiệu quả về chất lượng, giá thành phần mềm, từ đó tăng tính cạnh tranh và đem lại lợi nhuận cao cho doanh nghiệp. Trên thị trường có rất nhiều quy trình phát triển phần mềm hiện đại: Waterfall model (mô hình thác nước), V – Shaped Model (mô hình chữ V), Spiral Model (mô hình xoắn ốc), Iterative Model (mô hình tiến cận lặp)…. Trong đó, Agile development (hay còn gọi là Scrum development) và Lean development là hai quy trình có ưu và nhược điểm khác nhau, tùy theo tính chất và hướng phát triển của phần mềm mà các cá nhân và tổ chức tùy chọn loại hình quy trình phát triển phù hợp cho sản phẩm của mình.

Nhìn chung, các dự án phần mềm ứng dụng Agile ngày càng sâu rộng, khách hàng ngày càng đòi hỏi chất lượng phần mềm phải cao, ra lò nhanh để lấy feedback từ người dùng. Vậy, làm thế nào để có một quy trình DevOps đáp ứng được thực tế ngày một khắt khe hơn? Tất cả sẽ được tiết lộ qua chủ đề Modern DevOps workflow to improve developers’ production & quality tại Vietnam Mobile Day7!

Diễn giả: Huỳnh Ngọc Phi – R&D Manager – NashTech Vietnam

Chủ đề #5: Cách tiếp cận làm Mobile app cho doanh nghiệp 

Mobile app gần như đã thay đổi hoàn toàn cách mà doanh nghiệp dùng để giao tiếp với khách hàng, đối tác… và tích hợp mọi giá trị của doanh nghiệp (brand value), giá trị của sản phẩm, những giai đoạn có thể tốn nhiều thời gian và giấy bút, nay chỉ gói gọn trong những nút ấn trên màn hình cảm ứng của chiếc di động.

Nhìn chung, việc sử dụng các ứng dụng di động mang lại 3 lợi ích chính như sau:

  • Giao tiếp với khách hàng và Dịch vụ khách hàng: Với 90% thời gian trong số đó người dùng trải nghiệm trên các ứng dụng, đây chính là con đường ngắn nhất đưa sản phẩm đến gần với khách hàng và nghiên cứu hành vi của họ.
  • Interface và Chức năng: Ứng dụng trên di động dựa trên nguồn dữ liệu ban đầu chứa những thông tin quan trọng về hành vi người dùng, cụ thể hoá trên User Interface và các chức năng chính của ứng dụng nhằm giúp cho việc trải nghiệm của người dùng tối ưu nhất.
  • Tính bảo mật: Mọi thông tin từ cá nhân, hay các thương vụ khác đều có thể được mã hoá và lưu trữ trên ứng dụng nên tính bảo mật cực kì cao!

Tuy nhiên, để hiểu và làm được một app phù hợp với đối tượng khách hàng nhằm tạo nên nhiều giá trị cho khách hàng thông qua đó xây dựng thương hiệu doanh nghiệp thì là điều rất khó!

Chủ đề Cách tiếp cận làm Mobile app cho doanh nghiệp chắc chắn sẽ gợi mở nhiều câu trả lời thú vị dành cho các cá nhân, doanh nghiệp đang nung nấu ý tưởng là Mobile app, góp phần tăng tỷ lệ thành công, giảm tỷ lệ thất bại sau khi ứng dụng chính thức ra mắt trên thị trường.

Diễn giả: Nguyễn Duy Vĩ – Marketing Director – Tugo.com.vn

Chủ đề #6: Ứng dụng AI và blockchain để tối ưu hóa đầu tư mạo hiểm, và hơn thế nữa

Ngày nay đầu tư mạo hiểm vào startup, công nghệ và Innovation nói chung đang là trào lưu và mang một tầm quan trọng rất cao đối với tương lai của xã hội con người, đi kèm với nó là những khó khăn thử thách mà những người trong giới loay hoay chưa giải quyết được và những giải pháp đơn giản chưa thể giải quyết tận gốc.

Rất nhiều chuyên gia đang nghiên cứu kết hợp những ý tưởng mới với những nghiên cứu có sẵn của các chuyên gia về AI để tìm cách đưa ra giải pháp đột phá, đồng thời kết hợp Blockchain để hoàn chỉnh giải pháp đó về nhiều khía cạnh. Kết quả của sự kết hợp này có thể đem đến điều kì diệu mà bạn không thể ngờ đến!

Muốn biết điều kì diệu đó là gì? Tham gia chủ đề Ứng dụng AI & Blockchain để tối ưu hóa đầu tư mạo hiểm tại Vietnam Mobile Day nhé!

Diễn giả: Võ Việt Anh – CEO của DropDeck & Phan Đình Sơn – CTO của DropDeck

Chủ đề #7: Tại sao lại là Xamarin?

Hiện nay, khi phát triển ứng dụng di động, người ta luôn nghĩ tới đa nền tảng đầu tiên, chứ không còn chọn iOS hay Android để làm trước. Xamarin là một nền tảng giúp việc xây dựng ứng dụng trên nhiều nền tảng khác nhau, nhanh hơn với chi phí rẻ hơn bằng việc chỉ sử dụng một ngôn ngữ lập trình, một bộ công cụ để phát triển trong khi vẫn đảm bảo được hiệu năng và các đặc tính về trải nghiệm người dùng trên từng nền tảng.

Ngoài ra, Xamarin còn có những lợi điểm như sau:

  • Khai thác các thư viện và công cụ C# hiện tại để tạo nên các ứng dụng mobile
  • Sử dụng lại code giữa ứng dụng trên nhiều platforms khác nhau
  • Chia sẻ code giữa backends ASP.Net và ứng dụng dành cho người dùng

Hãy cùng tìm hiểu kĩ hơn tại sao Xamarin là một lựa chọn đầu tiên khi xây dựng ứng dụng trên nhiều nền tảng khác nhau với chủ đề Tại sao lại là Xamarin? tại Vietnam Mobile Day

Diễn giả: Vũ Đức Tuyến – CEO, Software Enginner tại NAXAM

Với những chủ đề “nóng bỏng” dự đoán sẽ mang lại nhiều lợi ích cho người tham dự, Vietnam Mobile Day hân hạnh là nơi tạo điều kiện để mọi người giao lưu, gặp gỡ và là cầu nối giữa các doanh nghiệp để thúc đẩy cho sự phát triển của thị trường công nghệ và thị trường Mobile trên thị trường Việt Nam.

Bức ảnh này sẽ thay đổi hoàn toàn cách học code của bạn!

Ngày nay, các loại biểu đồ lớn dùng để liệt kê chi tiết nhiều loại công nghệ khác nhau thường được sử dụng bởi các web developer trên các Interweb. Bức hình phía trên chính là một trong số các loại biểu đồ đó (chủ yếu dành cho các backend developer).

Tôi dám cá rằng nó sẽ là nguồn tư liệu tuyệt vời cho cả dân nghiệp dư và dân chuyên nghiệp. Tác giả của biểu đồ trên đã chỉ ra rõ ràng những công nghệ mà ta cần phải biết nếu muốn trở thành một frontend web developer, hay backend web developer, hoặc một system administrator.

Nhưng mà dù sao đi nữa thì tôi chắc chắn nó rất có ích đối với những ai mới bắt đầu học viết những đoạn code đầu tiên.

Vì sao tôi nói như vậy?

Bởi vì tôi đã làm một developer suốt hơn 15 năm (bắt dầu với việc tập tành về QBASIC game vào năm 8 tuổi). Tôi xem mình như một full stack developer cho nên tất cả những kiến thức được thể hiện ở biểu đồ trên ít nhiều đều rơi vào lĩnh vực của tôi.

Nào bây giờ hãy cùng nhìn kỹ vào nó. Trông thật là đáng sợ đúng không? Nhưng khoan đã, nó không phải là một biểu đồ về tất cả những điều bạn cần phải biết để trở thành một developer. Hoàn toàn không phải! Chẳng lẽ bạn thật sự nghĩ rằng tôi – hay bất cứ một developer nào khác – đều biết cách ứng dụng tất cả những kiến thức trên?

Không có chuyện đó đâu.

Khi mới bắt đầu với việc lập trình máy tính, bạn sẽ cảm thấy mọi thứ quá tải. Rồi bạn cũng sẽ nghe về những sinh viên có thể viết code với 10 ngôn ngữ lập trình, hay gặp gỡ những dân chuyên về Linux, hoặc cố gắng đuổi kịp hàng ngàn khái niệm khoa học máy tính mà giao sư đã giảng dạy trước đó. Và cuối cùng thì bạn cũng mắc sai lầm tương tự như hàng ngàn người khác: bạn nghĩ rằng bạn bắt buộc phải biết hết mọi kiến thức về lập trình.

Thật ra thì không cần phải học quá nhiều như thế đâu. Và cũng không ai mong đợi vào chuyện đó.

Mặc dù đã trở thành một developer được nhiều năm, là dân chuyên nghiệp, nhưng kỳ thật tôi biết rất ít các kiến thức đã được vẽ trên bức hình đó. Thậm chí có một số kiến thức mà tôi còn chẳng thể nhận ra! Hoặc cũng có thể tôi đã sử dụng chúng tại một thời điểm nào đó, nhưng 75% của việc sử dụng chúng chỉ chiếm khoảng dưới 1 tiếng đồng hồ trong cuộc đời tôi.

Nhưng nói thật, nếu tôi dành ra 1 tiếng để nghiên cứu thì chắc chắn tôi sẽ áp dụng được một vài trong số đó. Đơn giản bởi vì tôi biết học và nghiên cứu như một lập trình viên.

Bởi vì có rất nhiều công nghệ mới được phát minh mỗi ngày, và chúng luôn thay đổi cho kịp với xu hướng của thời đại, cho nên với cương vị là một developer, nếu bạn cứ cố gắng theo đuổi những công nghệ mới nhất, thì chắc chắn là bạn sẽ luôn thua cuộc. Tốt hơn hết, chúng ta nên chọn những công nghệ phù hợp với bản thân và thường xuyên cập nhật chúng cho kịp với xu thế.

Chính vì vậy, thay vì dành hết thời gian để mà học hết tất cả các ngôn ngữ lập trình và công nghệ, ta nên học cách học như một lập trình viên.

Học cách đọc tư liệu

Đây là một ví dụ về file input và output của Python. Còn đây là một ví dụ tương tự khác của Golang.

Bạn có phát hiện ra điểm tương tự giữa 2 ví dụ trên? Những ví dụ về các đoạn mã code, những dòng tóm tắt ngắn gọn, hay các loại interface (nếu bạn may mắn) sẽ là những người bạn dồng hành khi bạn đang cố gắng tìm câu trả lời cho những câu hỏi sau đây

  • Liệu đoạn code này có thực hiện được như những gì tôi mong muốn?
  • Làm thế nào để làm được điều mà tôi muốn?
  • Liệu có cách nào tốt hơn để đạt được mục đích mà tôi đã đặt ra hay không?

Học cách đọc mã nguồn

Đây là một ví dụ về việc triển khai bộ mã hóa JSON của Python. Nếu như một phần trong bộ thư viện của Python không hoàn hảo như bạn mong đợi, hay vẫn còn vài chỗ thiếu sót trong các file tư liệu, thì việc ta cần làm nhất ngay lúc này chính là kiểm tra các đoạn code, mặc dù lúc mới nhìn vào chúng sẽ làm bạn hoa cả mắt.

Sau đây là một vài mẹo mà tôi đã từng sử dụng:

  • Tính năng search code của Github
  • Sử dụng REPLs để đọc mã nguồn (ví dụ như dùng Pry cho Ruby)
  • Cloning để mở source project và insert các câu lệnh debug để xem nguyên tắc hoạt động của chúng.

Học cách Debug Code

Debuggers. Break statements. Print statements! Hãy học cách sử dụng chúng để giải quyết các vấn đề về code, bởi vì đây sẽ là những gì mà bạn dành phần lớn thời gian của mình để nghiên cứu. Sau đây là một số lưu ý cần ghi nhớ:

  • Khi bắt đầu với một lỗi bug nào đó, hãy cố gắng nhìn bao quát vấn đề hết mức có thể. Lỡ như nếu rắc rối không nằm ở các mã code, mà ở cái server mà ta đang sử dụng thì sao? Hoặc có thể là do data? Nếu bạn không thể tìm ra được chúng ngay lập tức, thì có nghĩa là bạn đã tìm sai chỗ rồi đấy.
  • Hãy thư giãn đi. Bởi vì khi debug, ta thường hay lạc lối về vị trí của bug, mà không thể tìm ra được nguyên nhân nằm ở đâu. Hãy nghĩ theo hướng tích cực, nên nhớ rằng bộ não của chúng ta về bản chất thì cũng chỉ là một chuỗi các dây thần kinh được liên kết với nhau, cho nên nếu như bạn chỉ nhìn vấn đề theo 1 hướng, bạn sẽ không bao giờ nhìn ra được bản chất của vấn đề. Cho nên là hãy thư giãn đi, nghĩ về những chuyện khác, để cho não bộ của bạn hoàn toàn được thả lỏng. Khi bạn trở lại, chắc chắn là bạn sẽ thấy bug ở ngay trước mắt mình thôi. Tôi đảm bảo.
  • Các đoạn code thì (hầu như) lúc nào cũng chính xác. Dù tốt hay xấu, ít nhất thì nó cũng đang thực hiện đúng với những gì mà ta đã thiết lập cho nó. Công việc lúc này của bạn đơn giản chỉ là tìm ra chỗ mà bạn đã thiết lập sai.

Học cách tìm kiếm sự giúp đỡ:

Nghe thì có vẻ dựa dẫm quá nhưng mà không đâu. Có rất nhiều công cụ có thể giúp bạn khi mà bạn đang “bí”. Tôi thường sử dụng:

  • Google
  • StackOverflow (thường tìm thấy trên Google)
  • Mục các issue Github của thư viện

Tiếp theo đây là một số điều cần lưu ý nếu bạn muốn ai đó giúp mình:

  • Những người nhận lời giúp bạn chắc chắn không thể nào biết rõ chính xác vấn đề của bạn. Việc cần làm là bạn hãy cung cấp cho họ những thông tin cần thiết, nhưng đừng quá lan man. Thỉnh thoảng bạn có thể cung cấp cho họ những đoạn code, application logs, program configurations, hoặc những vấn đề nổi bật trong trường hợp của bạn.
  • Hãy trình bày cho thật rõ ràng và chính xác. Sẽ rất khó khăn cho người khác để đọc một bài report về bug mà có quá nhiều lỗi chính tả, code chưa format, và cả những đoạn giải thích dài dòng “không lối thoát” về vấn đề mà bạn đang gặp phải.
  • Đừng post những data nhạy cảm. Kiểm tra kỹ lưỡng password, access token, và user data trong bài post của bạn. Và nếu bạn mắc phải sai lầm nào đó, hãy chịu trách nhiệm và giải quyết nó càng nhanh càng tốt.

Kết luận

Là một developer, có quá nhiều kiến thức để ta có thể thành thạo hết tất cả. Đừng quá ép buộc bản thân mình. Thay vào đó, hãy học cách làm việc chuyên nghiệp với vai trò là một developer, xây dựng toolset phù hợp với bản thân, và đừng cố gắng tìm kiếm lời giải cho mọi câu hỏi. Nên tập trung vào việc làm sao tìm ra cách giải quyết vấn đề một cách nhanh nhất.

Dù cho mới bắt đầu học viết code hay bạn đã là một tay chuyên nghiệp trong việc viết code, tôi hy vọng rằng bài viết này sẽ giúp ích cho bạn.

Hãy nhớ rằng: Không có ai yêu cầu bạn phải biết hết tất cả mọi thứ. Have fun, và không ngừng học hỏi.

Nếu muốn cùng tôi bàn luận về coding, bạn có thể liên lạc với tôi qua twitter hoặc truy cập vào Codevolve.com

Happy coding!

Nguồn: topdev.vn via Medium

 

Vietnam Mobile Day hỗ trợ startup lên đến 1000 USD

Vietnam Mobile Day là một trong những chuỗi sự kiện lớn nhất về Mobile được tổ chức hàng năm với quy mô khoảng hơn 10,000 lượt tham dự trên cả nước. Đây đồng thời cũng là sự kiện mang sứ mệnh hỗ trợ và đẩy mạnh thị trường mobile tại Việt Nam. Vì lý do đó, Ban Tổ Chức sẽ có những hỗ trợ cho tất cả các đơn vị startup trực tiếp tại sự kiện này.

Cụ thể, BTC sẽ dành riêng một khu vực cho các team start-up tiềm năng được BTC lựa chọn và cân nhắc hỗ trợ. Mỗi Start-up do BTC cân nhắc hợp tác sẽ được hỗ trợ 1 booth trong khu vực này để các bạn trưng bày, quảng bá những sản phẩm/dịch vụ của mình ngay tại sự kiện. Đặc biệt, các startup tham gia còn được các đại diện các bên khác hỗ trợ như là Google, Microsoft Azure với trị giá lên đến $1000.

Hy vọng sẽ nhận được sự tham gia từ các anh chị.

Điều kiện tham dự

Tất cả các team Start-up đã có sản phẩm/dịch vụ demo hoạt động trong thị trường Vietnam và trong khu vực.

Địa điểm tham dự:

  • 20/05/2017 tại Trung tâm Hội nghị 272 Võ Thị Sáu, Q.3, Tp.HCM
  • 27/05/2017 tại Trung tâm Hội nghị Forevermark, 614 Lạc Long Quân, Q. Tây Hồ, Hà Nội

Thông tin chi tiết về chương trình: http://mobileday.vn

Thông tin liên hệ BTC

Ms. Ngọc – 0944 685 243 – ngoc.do@applancer.net
Mr. Khiêm – 0902 951 296 – khiem.pham@applancer.net

F8 Recap: 10 điều bạn cần biết về đại tiệc công nghệ của Facebook

“Chúng tôi muốn biến camera trở thành platform đầu tiên cho thế giới ảo (augmented reality)” – Mark Zuckerberg, sư kiện Facebook F8

Augmented reality (AR) có thể nói là chủ đề chính của sự kiện năm nay. Từ augmented masks và special effects cho đến 360 video camera và rồi là Facebook Space (một ứng dụng cho phép người dùng chơi đùa cùng với gia đình và bạn bè trong một thế giới ảo ), Mark Zuckerberg và Facebook mong muốn có thể kết nối mọi người đến gần nhau hơn nhờ vào công nghệ AR.

Ngoài ra, hãng cũng công bố về Messenger, chatbots, Facebook Analytics, Facebook Live và còn nhiều nữa!

Sau hai ngày tham dự sự kiện F8, chúng tôi sẽ chia sẻ với bạn về 10 điều nổi bật diễn ra trong bữa tiệc công nghệ do Facebook tổ chức này.

Augmented Reality

Chủ đề chính của sự kiện lần này là Facebook tuyên bố họ sẽ tiếp tục hướng về công nghệ thực tế ảo nhằm kết nối mọi người lại với nhau (cũng như là các brand)

Tuy vậy, thay vì những cặp kính viễn tưởng thì hãng lại đặt niềm tin vào camera sẽ trở thành platform đầu tiên về thực tế ảo (kiểu như Pokemon GO)

Tất cả những tính năng camera mới mà Facebook chỉ vừa mới tung ra liên tục trong vài tuần gần đây hóa ra chỉ mới là bước đầu tiên của Facebook cho kế hoạch kết hợp công nghệ thực tế ảo vào social media của mình. Hiện hãng đang phát triển thêm một số tính năng mới, cho phép người dùng cũng như các công ty thêm hiệu ứng, làm trò với camera. Một số ví dụ điển hình là việc thêm vào các object 3D vào hình hoặc clip, chuyển 2D thành 3D, và thêm các thông tin kèm vào những object mà camera quay thấy.

Điều đó có ý nghĩa gì đối với các marketer:

Khi chuyện thực tế ảo trở nên mainstream, một channel hoàn toàn mới cho online marketing sẽ được sinh ra. Cũng giống như khi mạng xã hội xuất hiện, những ứng dụng và cơ hội cho quảng cáo sẽ là vô số.

Đối với tôi, ý tưởng khi bạn quay camera vào một object bất kì thì trên màn hình sẽ hiện ra bảng thông tin về chúng thật sự rất hấp dẫn. Theo Google, khoảng 82% smartphone user luôn tìm hiểu thông tin trước khi ra quyết định mua đồ. Augmented reality rất có thể sẽ thay đổi cách customer tìm kiếm thông tin, mua đồ cũng như tương tác với các hoạt động kinh doanh.

Hiện tại, Facebook tin rằng cách tốt nhất để bắt đầu với Augmented reality đó là tạo ra mask và special effect cho Facebook camera.

Camera Effects Platform

Sau khi nói về augmented reality, Mark Zuckerberg công bố Camera Effects Platform – một platform cho phép developer tạo ra frame, mask và special effect (có thể kèm cả filter và lense) cho Facebook camera.

2 sản phẩm chính của hãng trên platform này là Frame Studio và AR Studio

  • Frame Studio là một online creative editor cho phép người dùng tạo ra frame cho các ảnh được chụp bởi Facebook camera hoặc ảnh Profile
  • AR Studio là ứng dụng cho phép bạn tạo ra masks “động” và những hiệu ứng tương tác cho Facebook camera và Facebook Live.

Điều đó có ý nghĩa gì đối với các marketer:

Năm ngoái, trang Informative thông báo rằng lượng người dùng chia sẻ thông tin về bản thân trên Facebook đã giảm đi khoảng 21%. Với Platform này, Facebook kì vọng sẽ khắc phục được tình trạng trên khi sharing sẽ trở nên vui nhộn hơn.

Nếu nó thành công thì sẽ mở ra những cơ hội tuyệt vời cho brand marketing, tương tự như của Snapchat Geofilters. Brand có thể sử dụng các hiệu ứng vui nhộn, mask, filter nhằm kết nối được với khách hàng khi người dùng chia sẻ hình và video về sự sáng tạo từ hãng. Điều hay nhất ở đây là chúng đều hoàn toàn miễn phí khi nói về creative trên Facebook.

Với sự xuất hiện của Camera Effects Platform, Facebook có lẽ sẽ tiếp tục tập trung đẩy mạnh content như đối với live video của năm ngoái.

Facebook Spaces

Tuyên bố lớn tiếp theo từ hãng là Facebook Spaces – “một ứng dụng VR mới cho phép người dùng đi chơi với bạn trong một thế giới ảo vui nhộn” – Hiện đã có trên Oculus Store.

Sau khi mua lại Oculus, Facebook mong muốn có thể kết nối mọi người không chỉ với mobile app mà còn cả trong thế giởi ảo (virtual reality – VR). Facebook Spaces sẽ cho phép chúng ta đi chơi với người thân và bạn bè mà không lo sợ về khoảng cách địa lí.

Facebook Tips 发布于 2017年4月17日

Điều đó có ý nghĩa gì đối với các marketer:

Sẽ mất vài năm trước khi mạng xã hội trên VR trở nên mainstream (nếu nó thành công) nhưng các marketer cũng nên nghĩ về những cơ hội xuất hiện từ chúng. Hãy xem video ở trên, có rất nhiều cách để các hãng đưa quảng cáo vào trong trải nghiệm VR. Sau đây là một số ý tưởng khá vui mà tôi có thể nghĩ tới:

  • Travel agencies có thể cho phép người dùng trải nghiệm nơi họ muốn tới qua VR rồi mới quyết định mua vé.
  • Các nhà bất động sản có thể cho người dùng xem qua căn hộ chung cư với VR trước khi ra quyết đinh mua chúng.

Và còn rất nhiều ví dụ nữa mà một trong số chúng đã có thể làm được với Facebook 360 camera.

Giphy + Facebook Live

Cùng lúc với Facebook, Giphy đồng loạt launch 3 sản phẩm mới nhắm giúp việc chia sẻ GIF càng dễ dàng hơn. Trong đó nổi bật nhất là Giphy cho Facebook Live.

Với sản phẩm mới này, bạn và người người xem khác có thể add Gif vào trong live video. Đây là một cách nhằm tăng tính giải trí và tương tác với khán giả ngay trong thời gian thực.

Sau đây là một ví dụ đến từ một thành viên của Giphy team:

Going live on Facebook Live while reporting ~live~ from F8 using GIPHY Live!

GIPHY 发布于 2017年4月18日

Điều đó có ý nghĩa gì đối với các marketer:

Facebook luôn xếp những videos có lượng new feed nhiều và ưu tiên chúng trước những video không trực tuyển. Đây sẽ là một tính năng giúp tăng tính tương tác cho các video trực tuyến và cải thiện thứ hạng của bạn nhờ vào user news feed.

Sau đây là cách để dùng tính năng này:

  • Bấm vào nút “Live” trong Facebook app
  • Bấm vào magicwand ở góc trên bên phải màng hình
  • Chọn “GIPHY LIVE”
  • Bấm “Go Live”
  • Done

Khi bạn sử dụng front camera, sẽ có một ticker với hashtag mà bạn có thể bấm vào để thay đổi GIF. Khi bạn dùng back camera, một microphone sẽ xuất hiện giống như bạn đang phỏng vấn ai đó vậy.

Messenger Business Bots

Giờ đây có tới hơn 100,000 chatbot trên Messenger so với con số 30,000 chỉ mới vài tháng về trước. Nhằm giúp cải thiện sự kết nối giữa brand và khách hàng thông qua bot, Facebook cũng công bố việc sẽ tung ra nhiều bản update tại sự kiện F8 lần này.

Một trong số những update đó là Chat Extensions, cho phép người dùng chat với nhiều bot khác nhau cùng lúc.

Một update khác hay khác là M, Messenger’s AI assistant, giờ đây bot đã có thể lắng nghe bạn và đưa ra những lời khuyên, gợi ý chính xác và đúng lúc. Một ví dụ là khi bạn đang bàn luận với nhau về đồ ăn, M sẽ đưa ra gợi ý về việc dùng một bot đặt đồ ăn.

Điều đó có ý nghĩa gì đối với các marketer:

Lại là một cơ hội tuyệt vời cho các marketer để reach và connect với khách hàng của mình. Còn gì tuyệt hơn khi thay vì phải thủ công trả lời từng Facebook post thì giờ đây bot đã thay bạn và chúng thì làm việc 24/7.

Còn nếu bạn đã có sẵn bot cho trang Facebook của mình thì giờ đây bạn đã có thể dùng tính năng call-tolaction như “Get Support” hoặc “Shop Now” để mời gọi khách hàng tới với bot của bạn.

Điểm cộng khác của bot là chúng có thể giúp bạn hoàn thành những task nhỏ. Vốn cực kì hữu ích cho các dạng kinh doanh nhỏ, thiếu nhân lực. Nếu bạn vẫn chưa biết về bot marketing thì hãy vào đọc tại đây.

Messenger Discover Tab

Với số lượng bot được dùng ngày càng tăng trên Messenger Platform, Facebook muốn giúp người dụng chọn được loại bot đúng với mục đích của mình. Vì thế mà tại sự kiến F8, David Marcus, VP of Messenger, giới thiệu Discover Tab.

Nó là một section hoàn toàn mới trong Messenger app cho phép người dùng tìm kiếm bot, vị trí và cả business to message.

Discover tab on Messenger

Messenger 发布于 2017年4月17日

Điều đó có ý nghĩa gì đối với các marketer:

Với hơn 1.2 tỉ người đang sử dụng Messenger hàng tháng, Discover Tab có thể trở thành một nguồn traffic cực tốt cho công việc kinh doanh của bạn. Tuy rằng chatbot vẫn còn mới trong thời điểm hiện tại, nhưng vẫn tốt hơn nếu chúng ta đi theo trend ngay bây giờ trước khi quá nhiều nhiều tham gia.

Ngoài ra, các marketer cũng sẽ nghĩ ra cách mới nhằm tăng độ hiển thị brand của mình trong discovery tab.

Parametric QR codes

Facebook đang cố gắng giúp đỡ người dùng trong trải nghiệm sử dụng chức năng scan. Nhờ vào parametric QR codes mới với Messenger camera, khách hàng có thể tìm được thêm thông tin hữu ích về một sự kiện hoặc hoạt động kinh doanh thông qua một Messenger bot.

David Marcus cũng chõ biết Golden State Warriors, một đội bóng rổ của Mĩ, cũng sử dụng QR codes nhằm cung cấp thếm thông tin cho fan của họ.

Messenger Codes

Messenger 发布于 2017年4月17日

Điều đó có ý nghĩa gì đối với các marketer:

Đây có thể gọi là cơ hội cho “touch point” giữa khách hàng và business của bạn, vốn gì rất là tuyệt vời bởi bạn có thể tạo ra thêm giá trị cho họ.

Giả sử bạn đang muốn tổ chức một hội nghị, bạn có thể tạo ra nhiều QR codes chưa thông tin về sự kiện. Nhờ đó mà người tham dự sẽ scan QR codes bằng Messenger camera và nhận được thông điệp chào mừng, thông tin về lịch trình cũng như những câu trả lời cho thắc mắc thường gặp về hội nghị.

Smart Replies for Pages

Một trong những thử thách mà các startup và kinh doanh nhỏ gặp phải là việc trả lời toàn bộ các message họ nhận được. Với Smart Repilies, Facebook mong muốn sẽ giúp các công ty nhỏ tự động hóa một số process trong customer support.

Với sự trợ giúp của trí thông mình nhân tạo AI, Smart Replies giúp chủ các page trả lời những câu hỏi thường gặp nhất như giờ làm việc, địa chỉ, thông tin về sản phẩm. AI sẽ tự động thu thập những thông tin cần thiết và chọn ra những câu trả lời thích hợp với thắc mắc của người dùng.

Điều đó có ý nghĩa gì đối với các marketer:

Các manager của social media thường đùa rằng các chiến lược social media luôn được thực hiện bằng việc trả lời những câu hỏi từ khách hàng trên mạng xã hội. Một trong những lợi ích lớn nhất của Smart Replies là nó giúp bạn tiết kiệm thời gian để có thể làm ra những marketing content chất lượng cao.

Bởi AI sẽ tự động thu thập thông tin từ page của bạn, nó cũng là cách khá hay để update thông tin liên tục.

Facebook Analytics

Trước đây Facebook Analytics platform chỉ dành cho ứng dụng, nhưng giờ đây sẽ hỗ trợ ngay cả đối với các Facebook page cũng như offline conversion. Nhờ đó mà các công ty sẽ hiểu thêm về quá trình khách hàng từ tương tác tại Facebook page cho đến mua sản phẩm tại website của công ty.

Facebook Analytics, sử dụng trí thông minh nhân tạo, có khả năng tự động báo cáo lại trending cũng như những bât thường. Thay vì việc phải dành quá nhiều thời gian để lọc ra thông tin chính xác thì giờ Facebook Analytics sẽ chỉ lọc ra những thông tin cần thiết cho bạn.

Điều đó có ý nghĩa gì đối với các marketer:

Facebook Analytics được đánh giá có tiềm năng để trở thành một Google Analytics mới dành cho social media marketer. Trong khi Google Analytics cực kì tốt cho phân tích web, Facebook Analytics lại có lợi thế khi tiếp cận được với thông tin từ chính Facebook. Nhờ đó mà sẽ dễ dàng cho các marketer để chứng minh ROI đền từ social media. Bạn có thể xác nhận xem nếu người dùng thường xuyên comment trên facebook post của bạn cũng sẽ hay vào xem website của bạn để mua đồ.

Ngoài ra, dựa vào thông tin thu được từ Facebook Analytics, bạn sẽ xác định được dễ dàng hơn nhóm khách hàng, sở thích, behaviour của họ.

Kết nối toàn cầu

Facebook đang di chuyển từ việc kết nối gia đình và bạn bè đến việc tạo nên một cộng đồng mà tất cả các thành viên đều được kết nối với nhau. theo Yael Maguire, director của Connectivity Programs.

Nhóm phát triển tại Facebook hiện đang phát triển thêm nhiều project mới như Aquila và Terragraph nhằm cải thiện đường truyền và tính ổn định của internet cho mọi người trên thế giới.

Connectivity Lab Project ARIES

Facebook Engineering 发布于 2016年4月12日

Điều đó có ý nghĩa gì đối với các marketer:

Người dùng Facebook hiện tại đã chiếm hơn 30% dân số toàn cầu và mục đích của hãng là kết nối cả thế giới với tất cả mọi người. Facebook vẫn có growth rate rất khủng và tin chắc rằng các marketer vẫn sẽ tiếp tục đưa ra nhiều chiến lược khác nhau tập trung vào mạng xã hội Facebook này.

Lời Kết

Là một trong những công ty công nghệ lớn nhất thế giới, Facebook có sức ảnh hưởng rất lớn đối với cuộc sống hàng ngày của chúng ta cũng như cách mà ta tương tác với khách hàng và market sản phẩm. Thật đáng ngạc nhiên khi Facebook bỏ ra vô số công sức để có thể khiến cho marketing trên social media hiệu quả mà vui đến vậy.

Chúng tôi rất muốn được nghe suy nghĩ của bạn về những tuyên bố của Facebook trong sự kiện F8 lần này:

  • Bạn thấy phấn khích vì điều gì nhất?
  • Bạn thấy những tuyên bố này như thế nào?
  • Bạn nghĩ gì về những ảnh hưởng của nó lên cuộc sống của chúng ta?

Nguồn: topdev via Buffer

Framework có đang giết chết sự sáng tạo trong thiết kế Web?

Cứ gọi tôi là ông già cổ hủ đi nếu bạn muốn nhưng vào thời của tôi, website luôn ở cái level gọi là siêu “điên” luôn. Sự đổi mới luôn diễn ra và cực kì khó đoán bạn sẽ lại gặp phải cái “bựa” gì mỗi khi dùng internet. Màu sắc thì cực kì hoang dã, layout thì lúc nào cũng được đổi để thử nghiệm, và còn có quá nhiều thứ khác nữa đang diễn ra. Chưa kể vào web là tự nhiên thấy video hoặc nghe nhạc chạy phía sau background.

Chỉ mới có một thập kỉ trước thôi, website luôn phải tự tạo ra từ con số không nhưng bây giờ thì chúng đều hao hao nhau cả. Bạn lỡ click vào website của một công ty bất kì đi, bạn sẽ luôn thấy những thứ như:

  • Navigation bar ở phía trên top của cái page
  • Ảnh hoặc là Slider
  • Dòng quảng cáo viết bằng font sans-serif  tới mức đứng xa một cây số cũng thấy được
  • Ấy thế mà sub-title thì lại chả có gì đặc biệt!
  • Nút để scroll cái trang
  • Lại thêm nút với icon (ít nhất là 3 cái) chỉ để giới thiệu về công ty

Giờ đã là 2017 nhưng website vẫn cứ thế. Việc design cho web dường như trở nên quá dễ đoán. Bạn sẽ luôn nhìn thấy sự giống nhau lặp đi lặp lại chỉ khác nhau do màu sắc với kích cỡ thôi.

Sẽ có người nói rằng những trang web hồi xưa quá xấu và không ưa mắt nhưng đó là bởi vì khi đó chúng ta đều thử nghiệm và áp dụng mọi ý tưởng có thể. Còn giờ thì có cảm tưởng bạn đang truy cập vào các trang web giống nhau rập khuôn một cách kì lạ.

Kể từ khi nào mà thiết kế website đã trở nên buồn chán như vậy?

Thiết kế Web đã đi vào ngõ cụt và bị tắc nghẽn, một phần là vì nó trở nên dễ dàng – cũng bởi vì chúng ta muốn công việc mình nhẹ đi vì thế mà các framework được tạo ra nhằm giúp các designer có thể thiết kế website với ít công sức nhất.

Hãy lấy Bootstrap làm ví dụ. Số lượng người sử dụng nó tăng đến chóng mặt trong những năm gần đây và có tới 20% số website toàn cầu có sử dụng Bootstrap. Đó là một con số rất lớn khi mà tổng số trang web đã đạt 11 triệu trong năm nay.

Sự phổ biến của Bootstrap  đến từ việc cho phép designer tạo website nhanh chóng nhờ vào những yếu tố đã được tích trữ sẵn liên quan tới website design.

Đó cũng là điểm thu hút của những framework như Bootstrap. Tất cả đều cung cấp những hệ thống gọn nhẹ, các component dễ dùng cũng như những đoạn code dễ đọc giúp cho designer nhanh chóng hoàn thành một project.

Điều quan trọng nhất là những framework không chỉ cho phép designer làm việc dễ dàng và nhanh chóng, chúng còn giúp các marketer hoàn thành các task của mình bởi vì framework đã giúp làm hết mọi việc. Chúng được tạo ra nhằm giúp người dùng có trải nghiệm tốt nhất cũng như cho phép sử dụng yếu tố call-to-action.

Tôi hiểu vì sao mà mọi người yêu thích những framework như vậy bởi bạn không cần phải bắt đầu từ con số 0 lại chỉ cần tí tùy chỉnh cho phù hợp với nhu cầu của mình. Tuy nhiên sự phổ biến của những framework này cũng đang bắt đầu bào mòn sự sáng tạo trong design, một yếu tố cực kì quan trọng của việc xây nên một website.

Cũng bởi do những framework này dễ sử dụng mà sẽ có rất nhiều early adopter chọn nó. Tuy nhiên khi quá nhiều người dùng thì sẽ dẫn đến việc thiết kế của chúng ngày càng trở nên thông thường và cuối cùng là gây khó chịu

Không cần tìm dẫn chứng đâu xa, ngay bây giờ đã có tới 9,238 WordPress theme trong Themeforest database – 3,760 trong số đó được dùng với Bootstrap (chiếm hơn 42% số lượng WordPress theme được dùng cho website). Hơn nữa, nhu cầu sử dụng Bootstrap trong vòng năm năm nay vẫn tiếp tục tăng.

Điều này thật đáng lo bởi dù rằng framework cho ta được khá nhiều lợi ích thế nhưng nó lại không phải là con đường tốt duy nhất.

Việc sử dụng một mẫu thiết kê lập đi lập lại không khiến bạn trở thành một designer giỏi, nó chỉ biến bạn thành zombie thôi. Ban đầu bạn sẽ nghĩ rằng nó giúp công việc bạn trở nên dễ dàng hơn nhưng thật ra framework đang thay bạn đưa ra những quyết định về style. Và từ đó, bạn trở nên dễ dãi cũng như sử dụng các phương pháp chung chung mà rập khuôn từa tựa nhau.

Tại sao điều đó lại xảy ra với ta?

Sự thật là các website được build từ con số 0 luôn cho designer sự tự do trong khi framework lại bao gồm những điều kiện và qui tắc phải tuân theo. Nhờ vậy mà người dùng mới có thể sử dụng những framework một cách dễ dàng mà không phải lo tới những vấn đề phức tạp thường gặp.

Thế nhưng nó cũng có nghĩa là khi ta muốn thêm một thứ gì đó mới lạ nhưng nằm ngoài tầm của framework sẽ là điều bất khả thi. Việc thử nghiệm cũng trở nên vô nghĩa bởi bạn đã biết trước kết quả rồi.

Ta có thể học được điều gì từ vấn đề này?

Rất khó để có thể trở nên độc đáo, và việc cứ dựa dẫm vào một kiểu mẫu là không nên. Bạn, với tư cách của một designer, phải luôn rèn dũa sự sáng tạo của mình, điều đó có nghĩa luôn thử nghiệm vì thế mà việc bắt đầu từ con số 0 rất có ích. Tuy nhiên nếu bạn tự đặt ra giới hạn cho mình thì sẽ rất khó để có được những ý tưởng mới.

Luôn nhớ rằng framework cũng như là chiếc bánh xe phụ của xe đạp. Mục đích của chúng là giúp bạn bắt đầu làm quen một cách nhanh chóng và đến lúc nào đó bạn sẽ không cần đến chúng nữa. Hãy thoát ra khỏi comfort zone của mình và để sự sáng tạo được tự do.

Nguồn: blog.topdev.vn via hongkiat

Bí quyết sử dụng Typography như 1 designer thực thụ

Một trong những kĩ năng quan trọng nhất một designer cần có là chọn phông chữ. Đó là bởi vì chữ viết là một trong những cách chính để designer giao tiếp với người dùng. Typography có thể tạo nên một design và cũng có thể phá hủy nó.

Typography chứa đựng vẻ đẹp cũng như sự phức tạp trong nó. Có nhiều người sẵn sàng cống hiến cả đời chỉ để nghiên cứu về phông chữ. Thật may mắn, những công trình nghiên cứu của họ đã được lưu trữ kĩ lưỡng nhờ đó mà chúng ta có được hàng tấn các source online về Typography.

Bài viết này nhằm mục đích là mốc đầu tiên giúp bạn trong việc lựa chọn phông chữ cho việc design. Hi vọng nó sẽ khuyến khích bạn trong việc tìm hiểu về font cũng như kết hợp các kiểu chữ nhằm tạo ra những thiết kế đẹp.

Xác định mục đích của bạn

Trước khi bạn làm bất cứ điều gì, việc đầu tiên là phải xác định mục đích của việc design. Bạn muốn chuyển tải thông điệp gì? có những lựa chọn gì cho bạn sữ dụng để design?

Một design đẹp là khi phông chữ khớp với thông điệp nó muốn truyển tải. Đó là vì Typography là yếu tố chủ đạo trong việc tạo ra style, mood, tone trong thiết kế của bạn.

Ví dụ như bạn muốn thiết kế một greeting-card thể hiện sự nghiêm túc trong công việc thì bạn phải dùng font chữ đi chung với tông nghiêm túc. Hãy chú đến sự hòa hợp giữa chữ viết và phong cách thiết kế của bạn.

Còn nếu thiết kế một landing page sử dụng hình ảnh làm chủ đạo, hãy dùng phông chữ đơn giản để tránh gây làm sao lãng người xem. Chữ viết lúc này sẽ đóng vai trò hỗ trợ cải thiện khả năng truyền tải thông điệp đến người xem.

Biết đối tượng bạn muốn hướng đến là ai

Sau khi biết được mục đích thiết kế, bạn phải hiểu được đối tượng mình muốn nhắm đến. Đây là một bước quan trọng bởi sự khác biệt về độ tuổi, sở thích, văn hóa của người xem sẽ ảnh hưởng đến việc lựa chọn phông chữ.

Điều đó dẫn tới việc một số font chữ sẽ chỉ phù hợp dành cho trẻ em. Khi tập đọc, các bé sẽ cần những chữ cái rõ ràng cũng như với hình dáng to rộng. Một ví dụ điển hình trong trường hợp này là bản chứ cái Sassoon Primary, của Rosemary Sassoon, gồm list liệt kê những loại chữ cái mà trẻ dễ đọc.

Như vậy cũng sẽ có một số font chỉ dành riêng cho người lớn tuổi. Thường chúng có kích cỡ vừa vặn, có màu sắc tương phản nhưng không lòe loẹt, màu mè.

Vì thế nên khi sử dụng font chữ trong thiết kế phải luôn đặt bản thân mình vào vị trí của khách hàng và hiểu được họ.

Hãy tìm cho bạn nguồn cảm hứng

Bạn sẽ phải xem những tác phẩm của các designer khác. Cố gắng hiểu được tại sao họ lại đưa ra quyết định như vậy.

Cảm hứng về Font

The 100 Best Free Fonts của CreativeBloq là một bài viết rất hay cho bạn để bắt đầu việc học cách lựa chọn type. Trong bài viết, CreativeBloq cũng giải thích khá kĩ càng lí do sữ dụng từng phông chữ đó.

Một source khác cũng khá hữu ích là 100 Greatest Free Fonts Collection for 2015 bởi Awwwards.

Ngoài ra, Invision cũng tập hợp một list về Typography resource mà bạn sẽ tìm được rất nhiều thiết kế đẹp tạo cảm hứng cho mình.

Còn nếu bạn muốn xem về type được sử dụng trong website thì hãy vào Typ.io. Đây là một site chuyên ngâm trữ khá nhiều font đẹp được sử dụng bởi các website khác nhau. Ngoài ra, trang còn tích hợp cả trú thích CSS font được dùng trong từng trường hợp.

Bạn cũng nên vào những trang web ưa thích của mình để xem cách họ dùng font. Một cách khá hay là xài WhatTheFont, một Chrome extension cho phép bạn biết được font mà website đang dùng.

Cảm hứng về Font pairing

Vượt lên cả Font là cách kết hợp các kiểu chữ lại. Font pairing cũng quan trọng không kém việc sử dụng font. Khi các font chữ được kết hợp hoàn hảo thì sẽ tạo ra hiệu ứng visual nhiều cấp bật cũng như cải thiện khả năng truyền tải nội dung của thiết kế.

Hãy bắt đầu với Typewolf, một trang chuyên về cách kết hợp font của nhiều website khác nhau. Ngoài ra, Typewolf còn có font recommendations cũng như các bài hướng dẫn chi tiết về typography. Thật sự là một kho báu đối với các designer có hứng thú với font chữ.  

FontPair cũng là một trang khá hay, đặc biệt là khi sử dụng cùng với Google Fonts. Không chỉ thế, internet còn có hàng tá nguồn sưu tập khá hữu ích về font pairing dành cho bạn như: Typography: Google Fonts Combinations Typography: Google Fonts Combinations Volume 2. Cứ search font pairing trên các trang như Behance Dribbble.

Tự chọn font chữ cho mình

Sau khi đã chuẩn bị cho mình những kiến thức và cảm hứng thì giờ bạn đã sẵn sàng trong việc chọn font chữ rồi đấy. Nên nhớ rằng khi đưa ra quyết định hãy luôn nghĩ tới: Dễ đọc, dễ hiểu và mục đích.

Hãy thử những font thông thường và dễ đọc. Luôn ưu tiên những kiểu chữ đơn giản mà thực tiễn hơn là màu mè. Ngoài ra nên chú ý về mục đích của từng font bởi có một số thích hợp làm Header hơn là textbody.

Vì thế trước khi dùng một font chữ thì hãy tìm hiểu về mục đích sử dụng của nó.

Còn đối với font pairing thì chỉ nên kết hợp từ hai đến ba kiểu chữ khác nhau. Hơn nữa, chỉ sử dụng những font có sự tương phản với nhau. Nhờ thế mà sẽ giúp việc hướng người đọc theo trình tự mà ta muốn. Bạn cũng có thể tạo ra sự tương phản về hình ảnh nhờ vào việc dùng kích cỡ, màu sắc cũng như độ cao, đậm khác nhau trong font chữ.

Dành cho web font thì bạn có thể dùng Google Fonts, Typekit, hoặc Font Squirrel.

Xác định kích thước phông chữ

Bước tiếp theo sau khi đã quyết định được font là kích cỡ của chúng. Bạn có thể sử dụng tool Modular Scale, bởi Tim Brown, khá là hữu ích. Modular Scale là một hệ thống chuyên về xác định kích cỡ phù hợp của font.

Một ví dụ là bạn có thể muốn sử dụng kích cỡ dựa trên tỉ lệ vàng:

Golden Ratio (1:1.618)
1.000 x 1.618     = 1.618
1.618 x 1.618     = 2.618
2.618 x 1.618     = 4.236
4.236 x 1.618     = 6.854
6.854 x 1.618     = 11.089

Tuy nhiên đôi khi chúng lại quá lớn; hãy thử xem nếu chúng ta tiếp tục tăng nó lên thì sẽ có chuyện gì xảy ra

 

Golden Ratio (1:1.618)
...
11.089 x 1.618    = 17.942
17.942 x 1.618    = 29.03
29.030 x 1.618    = 46.971
46.971 x 1.618    = 75.999
75.999 x 1.618    = 122.966

Các bạn thấy đấy, tỉ lệ ngày càng tăng quá cao trong khi phần lớn các interface bạn sẽ cần tỉ lệ nhỏ hơn. May mắn là Modular Scale sẽ giải quyết vấn đề này cho bạn:

Minor Second    15:16 
Major Second    8:9
Minor Third     5:6
Major Third     4:5
...

Có nghĩa thay vì sử dụng tỉ lệ vàng, bạn có thể sử dụng những tỉ lệ khác như Perfect Fourth:

 

Perfect Fourth (3:4)
...
9.969  x 1.333     = 13.288
13.288 x 1.333     = 17.713
17.713 x 1.333     = 23.612
23.612 x 1.333     = 31.475
31.475 x 1.333     = 41.956
41.956 x 1.333     = 55.927

Sao khi đã chọn được kích cỡ bạn còn có thể làm tròn nó nếu thích:

Font Sizes
Header 1: 55px
Header 2: 42px
Header 3: 31px
Header 4: 24px
Header 5: 14px
Body: 17px
Caption: 14px

Modular Scale là một phần mềm sử thuật toán để đo lường chính xác kích thước của font chữ thế nhưng nó chỉ nên sử dụng như một bản hướng dẫn. Hãy dùng nó như điểm bắt đầu và chỉnh sửa nó cho vừa mắt bạn.

Tạo ra typography theo style của riêng bạn

Bước cuối cùng của quá trình là tạo ra một styleguide về font chữ của chính bạn nhằm tiêu chuẩn hóa kiểu chữ của các sản phẩm design của bạn.

Với các phần mềm như Sketch, bạn có thể tạo và chia sẻ những font style cũng như dùng những font đó.

Ở bước cuối cùng này bạn có thể tập trung vào điều chính những yếu tố như màu sắc hoặc kích cỡ.

Một lời khuyên về màu sắc: khi bạn chọn màu hãy tính đến cả bảng màu luôn. Chỉ nên chọn những màu hòa hợp được với cả bảng màu.

Ngoài ra nhớ thêm vào những thông tin sau trông styleguide của bạn: tên của font, kích cỡ, màu sắc, cách dùng. Bạn có thể xem qua một ví dụ điển hình từ Google’s Material Design typography guidelines.

Bản chất của typography là thử nghiệm. Nó vừa là khoa học và là nghệ thuật.

Tôi thách bạn dám vượt qua comfort zone của mình và khám phá những cách dùng font mới chưa từng có. Hãy luôn tìm hiểu và sáng tạo.

Nguồn: blog.topdev.vn via Medium

Chuyên gia Facebook, Truyền Thông Trăng Đen đã có mặt tại Vietnam Mobile Day!

Gặp gỡ chuyên gia Facebook tại Vietnam Mobile Day 2017! Đăng kí tại đây!

Sự kiện Vietnam Mobile Day đang bước vào giai đoạn quan trọng khi BTC TopDev dần hoàn thiện những bước chuẩn bị “nước rút” để đem đến cho người tham dự đại tiệc Mobile lớn nhất toàn quốc.

Tính đến thời điểm hiện tại – một tháng trước kỳ Vietnam Mobile Day chính thức “khai hỏa” tại Tp.HCM vào ngày 20/05, BTC đã hoàn tất được gần 85% trong số 100 chủ đề và 90 diễn giả sẽ góp mặt tại sự kiện trên cả 3 miền Tp.HCM, Hà Nội, Đà Nẵng.

vietnam mobile day

Ông Nguyễn Hữu Bình – Trưởng ban tổ chức Vietnam Mobile Day – CEO của TopDev đã công bố những số liệu không thể bỏ qua về ngành Mobile, dự báo những xu hướng mới đang từng bước diễn ra trên diện rộng như Digital Transformation cũng như xác nhận sự tham gia hợp tác nội dung của các tập đoàn công nghệ lớn gồm Facebook, Microsoft, Nielsen… cùng các nhà tài trợ Ví Việt, Verisign, Appota, PAVietnam và Hiệp hội Internet Việt Nam.

Chuyên gia Parse.com đình đám – Diễn giả Nakul Patel, Head of APAC SMB tại Facebook

Anh Nakul Patel là một trong những chuyên gia đình đám trong lĩnh vực Mobile toàn cầu với gần 10 kinh nghiệm làm việc tại hai tập đoàn công nghệ lớn nhất thế giới hiện tại là Google và Facebook.

vietnam mobile day

Gia nhập Facebook sau khi Facebook mua lại startup Parse.com vào năm 2013, anh đóng vai trò quan trọng trong việc triển khai các hoạt động phát triển kinh doanh và mở rộng mối quan hệ hợp tác trong nhiều sản phẩm thuộc Facebook platform. Đặc biệt, anh Nakul Patel cũng từng có 5 năm làm việc tại Google trong vị trí quản lý sales của 5 thành phố lớn là Beijing, Tokyo, Austin và Ann Arbor. Hiện tại, anh là Head of SMBs thuộc khu vực Châu Á – Thái Bình Dương.

Sáng lập Truyền Thông Trăng Đen – Diễn giả Nguyễn Ngọc Long

Cộng đồng Marketer ắt hẳn đã rất quen thuộc với những chia sẻ sắc bén thể hiện kinh nghiệm giải quyết các case studies điển hình của anh Nguyễn Ngọc Long, người sáng lập Truyền thông Trăng Đen.

Trong sự kiện Vietnam Mobile Day, anh Nguyễn Ngọc Long đã giới thiệu đến khán giả trong ngành startup tất tần tật những kiến thức về Growth Hacking, thu hút sự quan tâm đông đảo của giới công nghệ lẫn giới Digital Marketing.  Chủ đề mà anh Ngọc Long mang đến sự kiện năm nay sẽ được bật mí vào phút cuối, hứa hẹn tiếp tục làm “nức lòng” người tham dự!

Nhiều chuyên gia đánh giá, qua 12 chủ đề thuộc 3 phân mảng chính là Mobile Commerce, Mobile Business, Mobile Technology cùng hàng trăm diễn giả được cập nhật liên tục trong thời gian tới, Vietnam Mobile Day với sự bảo trợ của VECOM chắc chắn sẽ giải quyết được mọi thắc mắc liên quan đến các vấn đề trong hệ sinh thái Mobile của 10.000 người tham dự tại Tp.HCM, Hà Nội và Đà Nẵng

Tương tự truyền thống mỗi năm, Vietnam Mobile Day vẫn thực hiện các hoạt động hỗ trợ startup, kết nối các cá nhân và doanh nghiệp để cùng nhau xây dựng hệ sinh thái Mobile lớn mạnh, góp phần cho những bước tiến mạnh mẽ về sau. Startup đăng kí booth tại sự kiện

THÔNG TIN CHI TIẾT VỀ SỰ KIỆN

1/ Thời gian & địa điểm sự kiện

  • 20/05/2017 tại Trung tâm Hội nghị 272 Võ Thị Sáu, Q.3, Tp.HCM
  • 27/05/2017 tại Trung tâm Hội nghị Forevermark, 614 Lạc Long Quân, Q. Tây Hồ, Hà Nội
  • 03/06/2017 tại OneOpera Hotel, 115 Nguyễn Văn Linh, Q.Hải Châu, Tp. Đà Nẵng

2/ Thông tin liên hệ

  • Website: http://mobileday.vn
  • Fanpage chính thức: https://www.facebook.com/mobiledayevent/
  • Để biết thêm thông tin xin vui lòng liên hệ:
Ms. Ngọc Đỗ
Điện thoại: 08 6273 3497
Mobile: 0944 685 243
Email: ngoc.do@applancer.net

Hàng trăm quà khủng đến tay trước thềm Vietnam Mobile Day 2017

Cơ hội có 1-0-2 giành lấy những chiếc vé tham dự sự kiện có TỔNG TRỊ GIÁ LÊN ĐẾN 6.000.000 VNĐ!

Luật chơi:

Danh sách trúng giải sẽ được ước tính theo SỐ LƯỢT LIKE COMMENT tính từ trên xuống

Thời gian chơi:

20h tối ngày 19/04/2017 đến 11h sáng ngày 22/04/2017

Giải thưởng:

  • 1 giải nhất – CẶP VÉ STANDARD tham dự Vietnam Mobile Day 2017 với tổng giá trị 500.000 VNĐ
  • 4 giải nhì – Mỗi giải 1 VÉ STANDARD tham dự Vietnam Mobile Day 2017 trị giá 250.000 VNĐ/ vé
  • 20 giải ba – Mỗi giải 1 MÃ CODE GIẢM GIÁ 50%/ vé Standard tham dự Vietnam Mobile Day 2017
  • 40 giải khuyến khích – Mỗi giải 1 MÃ CODE GIẢM GIÁ 50.000 VNĐ/ vé Standard tham dự Vietnam Mobile Day 2017

Nhanh tay CODE THẢ GA – DỰ SỰ KIỆN THỎA THÍCH ngay bây giờ nha các dev!

Gặp gỡ chuyên gia Facebook tại Vietnam Mobile Day

THÔNG TIN CHI TIẾT VỀ SỰ KIỆN

1/ Thời gian & địa điểm sự kiện

  • 20/05/2017 tại Trung tâm Hội nghị 272 Võ Thị Sáu, Q.3, Tp.HCM
  • 27/05/2017 tại Trung tâm Hội nghị Forevermark, 614 Lạc Long Quân, Q. Tây Hồ, Hà Nội
  • 03/06/2017 tại OneOpera Hotel, 115 Nguyễn Văn Linh, Q.Hải Châu, Tp. Đà Nẵng

2/ Thông tin liên hệ

  • Website: http://mobileday.vn
  • Fanpage chính thức: https://www.facebook.com/mobiledayevent/
  • Để biết thêm thông tin xin vui lòng liên hệ:
Ms. Ngọc Đỗ
Điện thoại: 08 6273 3497
Mobile: 0944 685 243
Email: ngoc.do@applancer.net

Những điều không thể bỏ lỡ của F8 Facebook ngày đầu tiên

F8, hội nghị developer hàng năm do Facebook tổ chức, đang được tiến hành.

Bắt đầu sự kiện với Mark Zuckerberg cùng câu nói đùa ám chỉ F8 khác – phần thứ 8 của  the Fast and the Furious franchise: The Fate of the Furious. Có vẻ Facebook đang sharing hastag với Vindiesl and Co cho sự kiện năm nay, một tình huống có lẽ sẽ thật sự hấp dẫn nếu họ mời được The Rock tham gia sự kiện để…..bình luận về những breakthrought trong trí tuệ nhân tạo và machine learning.

Tất nhiên là Facebook chả bao giờ làm thế. Một sai lầm đáng tiếc.

Zuck lại tiếp tục dọa rằng ông sẽ bắt mọi người nghe cho hết bản manifesto dài tới 6 ngàn dòng để bắt đầu cho sự kiện, may thay đó chỉ là lời đùa khi ông tóm tắt khá ngắn gọn trong khi vẫn cười hóm hỉnh.

AR Studio: AR platform cho camera của bạn

Zuckerberg nhanh chóng lấy lại phong độ và thể hiện đúng chất của một CEO và co-founder Facebook khi ông bắt đầu nói về AR. Zuck bày tỏ mong muốn “mở rộng tính vật lí trong thế giới online” và hỏi mọi người rằng “Có biết bao nhiêu thứ trong cuộc sống quanh ta vốn không cần đến những tác động vật lí”, trong khi màn hình phía sau ông hiện lên một thế giới ảo về cờ vua, hoặc là xem TV.

Tại Facebook, Zuckerberg cho biết nhóm đang tập trung phát triển 3 tính năng sử dụng của AR:

  • Hiển thị thông tin
  • Add vật “ảo” vào cảnh thật từ hình và video
  • Khả năng enhance những vật thu được trong camera

Sử dụng một công nghệ gọi là SLAM (simultaneous localization and mapping) – Zuckerberg đưa ra một bản demo về kỹ thuật mapping location cực kì nhạy với ví dụ là về một tô ngũ cốc. Nhờ vào các thông tin phức tạp về visual được thu trực tiếp trong real time, buổi ăn sáng ngay lập tức trở thành một trải nghiệm AR vui nhộn với cá mập bơi trong tô cứ cũng như xuyên qua bàn y như rằng chúng là nước vậy. Điều đó thật đáng kinh ngạc, và thể hiện cho ta thấy SLAM mạnh mẽ đến mức nào khi mà nó có thể phát hiện ra những chi tiết nhỏ và ngay lập tức mapping nó nhằm add vào các vật “ảo” nhằm cải thiện trải nghiệm cho người dùng.

Để có được những 3D object chân thật, Zuck cho biết, ta cần phải track được location thật chính xác. SLAM có vẻ đã hoàn thành tốt nhiệm vụ đó cho Facebook AR platform. Từ đó, bạn có thể thêm vào những hình 2D, thay đổi ánh sáng, quay camera cũng như những hiệu ứng vui nhộn như đổ đầy nước vào phòng, thêm bóng nẩy hoặc là cho trời mưa kẹo -”Tương lai sẽ trở nên ngọt lịm” – Zuck hóm hỉnh nói.

Facebook cũng đang tập trung mở rộng những tính năng khác.

Hãng cũng giới thiệu AR tool dành cho Nike với tính năng hiển thị và chia sẽ trải nghiệm chạy hoàn toàn mới mẻ. Dù các hiệu ứng vẫn còn hơi “nhí nhố” như thêm mồ hôi, thiết bị chạy “khủng” hoặc là cả một background hoàn toàn mới nhằm giúp người dùng Facebook chia sẽ thêm thông tin về bản thân mình trên. Hãng cho biết, trong quá khứ, việc khiến người dùng luôn update thông tin của họ là vô cùng khó khăn. Giờ đây thì phần lớn chúng ta dùng Facebook như một platfrom để nói chuyện (Messenger), quản lí một business page, hoặc để chia sẻ meme, news và cả video. Việc cho phép người dùng thêm vào những dấu ấn riêng của họ vào hình và video được hãng đánh giá là một giải pháp tiềm năng.

Có lẽ tính năng tuyệt nhất chúng ta thấy từ demo của AR platform là khả năng thêm note vào tất cả các vật dụng quanh mình – khoanh tròn một món ta thích trong menu của nhà hàng, để lại note nhắc nhở trên tủ lạnh cho vợ bạn. Tất đề thể hiện sự thực tiễn cũng như vô cùng hữu ích.

Cũng cùng lúc này, VP of Platform và Marketplace Deb Liu thông báo về việc sẽ có thêm nhiều tính năng khá hay sẽ được trình làng cho các developer trong vài tháng tới, như motion tracking. Hãng cũng cho biết các tính năng nâng cao của AR sẽ được đưa ra trong khoảng cuối năm nay.

Nhận diện hình ảnh

Facebook CTO Mike Schroepfer là người tiếp theo nói về việc hãng đã đạt được những tiến bộ vượt bật trong nhận diện hình ảnh. Bắt đầu từ project “alexanet” (2012), một nerual network cơ bản với khả năng tính toán những yếu tố có trong nội dung của hình ảnh. Tuy rằng nó không thật sự tốt nhưng ít ra Alexanet vẫn cho user biết được sự hiện diện của người trong ảnh.

Và phần mềm vẫn luôn được cải thiện không ngừng. tới năm 2015, Facebook đã có thể nhận diện được nhiều object và hình ảnh cũng như mask chúng một cách chính xác hơn.

Giờ đây, cùng sự giúp đỡ từ công nghệ Mask 4-CNN, Facebook đã có thể vẽ ra những mask đúng với hình dáng của object trong ảnh, xác định chúng, thậm chí còn dùng cả 17 point key deduction nhằm thông báo cho hệ thống (hoặc người dùng) về cả cách pose của các object cũng như định hướng của chúng trong hình thu được. Tuy nghe có vẻ hấp dẫn nhưng thật ra nó chỉ mới là bề nổi của tảng băng thôi. Vừa mới chỉ được tung ra 1 tháng trước, Mask 4-CNN được kì vòng trong tương lai gần sẽ cho phép người dùng khả năng xóa bỏ hoàn toàn một vật thể trong hình và trong thời gian thực. Để mình họa điều đó, Schroepfer đưa ra video về biển có những người lướt ván.

và ông tự xóa đi những người có trong đó và video lúc này chỉ hiện ra biển không thôi.

Schroepfer cũng nói rằng khi chúng ta làm đúng thì kết quả thu được sẽ vô cùng tuyệt vời. Đây sẽ là công nghệ được kì vọng sẽ hỗ trợ Oculus – hoặc Facebook’s headset phiên bản prototype mới, một model tích hợp 4 camera chuyên tracking cũng như công nghiệm SLAM – nhằm để thu thông tin từ thế giới thực và sử dụng chúng để tạo ra một môi trường ảo.

Facebook Spaces

Head của Social VR, Rachel Franklin, là diễn giả tiếp theo. “VR là một platform dành cho tương tác với social, chúng tôi tạo ra nó với goal lấy con người làm trung tâm” – Cô nói trước khi tuyên bố về ứng dụng đầu tiên cho VR của Facebook, Spaces

Ứng dụng nhằm giúp đưa tất cả mọi người bạn tương tác với trên facebook vào một thế giới ảo. Sau khi tạo cho mình một avatar thì bạn có thể cùng với tối đa 3 người bạn tham gia vào trải nghiệm VR. Những social experience này sẽ cho phép người dùng xem 360 video cùng nhau, chơi game ảo hoặc là khoe một căn hộ mới với gia định và bạn bè của mình – Tất cả đều diễn ra trong không gian ảo của Facebook.

Không chỉ thế, bạn còn có thể gọi bạn bè không có VR headset và mở ra một session ảo với mọi người khi họ trả lời bạn sử dụng chức năng gọi video trên Messenger.

Spaces sẽ được launches bản beta trong cuối ngày hôm nay tại Oculus store.

Messenger Platform 2.0

David ‘The Rock’ Marcus, Facebook’s VP của Messaging Products, bắt đầu với tuyên bố về phiên bản mới của Messenger. Ông nhấn mạnh quá trình trưởng thành của Messenger platform – Bốn bản update kể từ lúc release bao gồm tính năng quick replies, menu không đổi, cũng như giải pháp native payment – cũng như nhắc đến sự thành công của retailer nhờ vào platform – một dating bot giúp convert với rate cao hơn tới 30% so với các channel khác, hoặc là sự cải thiện trong sự hài lòng của khách hàng nhờ vào việc các hãng cho phép dịch vụ chăm sóc khách hàng trên Messenger.

Tuy nhiên, highlight lần này không phải về Messenger mà là người em của nó – Messenger 2.0.

Đầu tiên, là việc Spotify và Apple music sẽ được thông báo cùng lên platform này. Sẽ không còn cảnh cứ phải switch qua app này app nọ, tất cả đều sẽ được tích hợp trên Messenger.

Tiếp đó, Marcus nói về mong muốn đầu tư để khám phá bằng việc chào bán các bot và interaction tốt nhất cho khu vực local của bạn sống. Chỉ mới vài tháng trước, số bot chỉ ở 33,000 thì giờ nó đã nhảy vọt lên 100,000. Những tính năng như order đồ ăn trong một group chat cũng như vô vàng các hoạt động kinh doanh khác sẽ chớm nở với hệ thống payment mới của Facebook.

Cuối cùng, Marcus cho biết sẽ có nhiều bản update trong thời gian tới cho game platform của Facebook. Những update này sẽ bao gồm tính năng tabs mới nhằm giúp track progress của game bạn đang chơi cũng như các thử thách dành cho bạn bè của bạn. Marcus cũng nhấn mạnh rằng có tới 1.5 tỉ game đã được chơi trên platform.

Techtalk via thenextweb

Tầm quan trọng của Product Management

Trong thời đại Digital hiện nay, mỗi ngày trôi qua là mỗi ngày cụm từ Product Management xuất hiện nhiều hơn.  Vậy khái niệm Product Management đến từ đâu và tầm quan trọng của Product Management gì?

Như Martin Eriksson đã mô tả trong The History and Evolution of Product Management, nghề Product Management ra đời bởi những nhân vật đến từ Procter & Gamble. Nếu muốn thực hiện những quyết định đúng đắn nhất dành cho khách hàng thì trước hết phải có một Product Manager (PM), được xem như vị “khách hàng nội bộ” đại diện cho tiếng nói của khách hàng.

Mặc dù ban đầu quản lý sản phẩm được coi là một phần của bộ phận Marketing và gần đây là một chức năng của bộ phận Engineering, nhưng bây giờ thì không. Khái niệm Product Management đã được sử dụng rất phổ biến ở hầu hết các phòng ban trong công ty. Trớ trêu thay, tính chất độc lập của Product Management liên quan nhiều đến các điểm giao thoa quan trọng trong các hoạt động kinh doanh.

Tuyển dụng Product Manager lương cao

Quản lý sản phẩm là gì?

Với mục đích của bài viết này, chúng tôi đang nói về bối cảnh phát triển phần mềm, nơi 1 product là 1 ứng dụng (web hay di động), 1 dịch vụ trực tuyến, hoặc 1 trang web mà người dùng tương tác. Người quản lý sản phẩm tập trung vào phát triển phần mềm có thể chịu trách nhiệm cho toàn bộ hệ thống hoặc một phần của hệ thống.

Để hiểu được quản lý sản phẩm là gì, chúng ta nên hỏi theo chiều ngược lại: Cái gì không phải là Product Management? Product Management là 1 chức năng kinh doanh tập trung vào thu được giá trị tối đa từ các sản phẩm trên thị trường và hơn thế nữa, đó là cả 1 chiến lược, cả 1 chiến thuật. Bên cạnh đó, trong thế giới phần mềm, Product Management còn là 1 chức năng công nghệ (technology function). Bạn phải hiểu được cách phân phối sản phẩm và các kỹ năng cần có để tương tác với dev một cách hệ thống.

Product Management cũng thể hiện vai trò riêng trong trải nghiệm người dùng (UX), vì các sản phẩm kỹ thuật số mà người tiêu dùng tương tác chỉ có thể được cải thiện thông qua phản hồi và thử nghiệm của người dùng. UX vàcông dụng của 1 sản phẩm có sự liên kết chặt chẽ với nhu cầu thiết kế và phân phối của sản phẩm đó.

Tầm quan trọng của Product Management

Product Management là chức năng quan trọng trong 1 tổ chức, đảm bảo các công việc ưu tiên theo mục tiêu của công ty. Đây là một trong những lý do khiến vị trí PM (product manager) đóng vai trò không thể thiếu trong startups và doanh nghiệp.

Khi cần thiết, những đặc tính mới của sản phẩm cần được xác định 1 cách phù hợp và ưu tiên hơn nên vai trò của PM lúc này là tạo điều kiện thuận lợi cho các cuộc đàm luận phù hợp với lộ trình phát triển sản phẩm. Chức năng quan trọng nhất của Product Management đó là đưa ra những quyết định phù hợp với nhu cầu người tiêu dùng lẫn mục tiêu của công ty.

Trên thực tế, khi ngày càng có nhiều công ty chú trọng đến sự đổi mới, vai trò của Product Management đã trở thành một yếu tố then chốt trong sự thành công của các tổ chức đó. Dưới đây là một số bí quyết để các PM mang đến những sản phẩm thành công trong các công ty thiên về đổi mới.

Xác định nhu cầu thị trường mục tiêu

Dù là sản phẩm hay dịch vụ nào đi nữa, nếu bạn lập trình các tính năng hoặc chức năng sai thì cũng dẫn đến thất bại. Theo nghiên cứu từ CB Insights, 42% số lượng startups không hiểu nhu cầu thị trường.

Lúc này, Product Manager cần có những kĩ năng cần thiết để xác định nhu cầu của người dùng. Cũng theo CB Insights, các công ty cho phép PM dành thời gian để phỏng vấn tìm hiểu thị hiếu khách hàng sẽcung cấp các sản phẩm phù hợp với người tiêu dùng nhanh hơn so với những công ty khác.

Tập trung vào Chiến lược kinh doanh cốt lõi

Mọi sản phẩm hoặc dịch vụ thành công cần tập trung vào chiến lược cốt lõi và các PM có trách nhiệm theo dõi chiến lược kinh doanh bằng cách cung cấp những tư liệu cần thiết ở cấp độ điều hành. 

PM không chỉ đầu tư thời gian vào thị trường mà còn đảm bảo sản phẩm phù hợp với hoạt động kinh doanh chính, đảm bảo những gì mà team đang lập trình có đặc điểm và mục đích sử dụng định vị sản phẩm một cách hiệu quả nhất.

Vị vua Lean Product Development

Hầu hết các tổ chức chỉ đầu tư thời gian và tiền bạc mà không theo dõi tác động của quá trình lập trình sẽ không thể thấy được bức tranh lớn. Sự cải tiến đòi hỏi tinh thần tập trung và khả năng bảo tồn các nguồn lực – đây cũng chính là những gì Lean Product Developement mang lại (Lean Product Development là phương pháp phát triển sản phẩm khuyến khích việc đưa ra sản phẩm nhanh, chu trình cải thiện ngắn và liên tục, để có thể tìm hiểu và bắt nhịp thị trường nhanh chóng)

Những PM có kiến thức về các nguyên lý lean sẽ phân phối nhân lực vừa đủ để đạt được lợi nhuận như mong muốn. Họ cũng tái sử dụng kiến ​​thức theo những cách hiệu quả hơn để giảm thiểu thời gian thông qua vòng đời phát triển sản phẩm.

Tuyển dụng Product Manager lương cao

Mindset về Product Management

Các tổ chức yêu cầu mindset tổ chức sản phẩm(product organization mindset) là những tổ chức hướng về các hoạt động giao tiếp cởi mở và minh bạch, thường trao quyền hạn cho PM để họ tiến hành các hoạt động phỏng vấn người dùng và nghiên cứu sản phẩm.

Hơn nữa, một công ty có mindset sản phẩm tốt sẽ giúp cho chức năng quản lý sản phẩm được hình thành sớm hơn trong thời gian khởi nghiệp, thông qua đó sẽ đảm bảo các nguồn lực Product Management phù hợp với tương quan phát triển của công ty trong thời gian dài

Một số chuyên gia cho rằng Product Management chỉ nên thực hiện ở cấp điều hành, như chuyên gia Saeed Khan đã chia sẻ trong bài viết Pragmatic Marketing rằng: “Nếu 1 nhân viên làm việc tốt giúp công ty tránh được những sai lầm lớn thì với cấp độ điều hành, một chuyên gia kinh nghiệm có thể lều lái công ty đi từ thành công này đến thành công khác”.

Kết luận

Các PM có vai trò quan trọng trong môi trường làm việc hiện nay nhờ khả năng quản lý vòng đời sản phẩm, thu thập các ý tưởng từ cấp độ điều hành, lên chiến lược và quản lý quy trình đưa sản phẩm ra thị trường. Sản phẩm là huyết mạch của công ty nên luôn đòi hỏi phải đổi mới liên tục thì mới cạnh tranh được.

Bằng cách định vị Product Management như 1 chức năng chiến lược về khả năng ra quyết định ở cập độ điều hành, bạn sẽ hình thành được tư duy xác định xu hướng, tập trung vào thị trường và cân bằng doanh số bán hàng hôm nay với nguồn lực đầu tư cho ngày mai.

Nguồn: Techtalk.vn via onitsaxis

10 câu nói cực hay về lập trình

câu nói hay về lập trình

TopDev xin giới thiệu đến các bạn 10 câu nói hay về lập trình của những người nổi tiếng trong ngành này. Cùng tìm hiểu họ là ai và những câu nói đó là gì trong bài viết nhé!

Bắt đầu thôi!

Ellen Ullman

Nhà văn/ Kĩ sư phần mềm

“Chúng ta tạo nên máy tính (hệ thống) như xây một thành phố vậy: trải qua thời gian, không có kế hoạch cụ thể, bắt đầu từ các phế tích”

Mọi người ai cũng thích những câu nói mà họ có thể liên quan tới bản thân! Vì thế mà cũng là điều dễ hiểu khi quote của Ellen được tới 1,9k Like.

Cựu kĩ sư phần mềm Ellen Ullman có hơn 29 năm kinh nghiệm với nghề lập trình trước khi bà chuyển qua làm nhà văn viết chuyện khoa học viễn tưởng. Nhờ vào những hiểu biết sâu rộng về máy tính, Ellen cho ra những tiểu thuyết ăn khách như The Bug, Close to the Machine By Blood.

Fredrick Brooks

Nhà văn/Kĩ sư phần mềm/Chuyên gia máy tính/Computer architect

“Một lập trình viên mất một tháng để làm xong việc thì với 2 lập trình viên sẽ là 2 tháng”

Đây là một trong những Tweet nổi tiếng nhất được đăng trên CodeWisdom kể từ khi tài khoản mới được thành lập tháng 2 2012. Không có gì đáng ngạc nhiên khi quote này thu hút khá nhiều sự chú ý cũng như châm ngồi cho các cuộc bàn luận và tranh cãi.

Fred Brooks là tác giả của quyển Mythical Man-Month.

Patrick McKenzie

Engineer / Blogger về Software Marketing

“Những devloper nổi tiếng đều gặp phải những vấn đề nan giải cho đến khi họ giải quyết được nó”

Là một lời nhắc nhở cho tất cả mọi người rằng điều gì cũng có thể, đặc biệt là khi bạn gặp phải một vấn đề trong code và không biết phải làm gì.

Michael A. Jackson

Chuyên gia máy tính/ Nhà văn

“Nguyên tác để tối ưu hóa:

Nguyên tắc 1: Đừng có đụng vào!

Nguyên tắc 2 (Chỉ dành cho chuyên gia): Chưa phải lúc để đụng vào!”

Những Tweet về lời khuyên luôn thu hút được sự chú ý. Quote của Jackson có hơn 600 like.

Michael đã đưa ra khá nhiều phương thức lập trình khác nhau bao gồm: Jackson Structured Programming, Jackson System DevelopmentProblem Frames Approach. Ông cũng là tác giả của Principles of Program Design and Software Requirements & Specifications.

Đoạn quote trên cũng được nhắc tới trong Steve McConell’s book Code Complete

Grace Hopper

Kĩ sư máy tính/ Đô đốc Hải quân Hoa Kỳ

“Làm sao mà bà biết rõ về máy tính thế?”

Grace hopper -”Không hề! Chỉ là tôi sinh ra trước nó thôi”

Được gọi là Amazing Grace, Grace Hopper là một người phụ nữ nổi tiếng, được kính nể cũng như là nguồn cảm hứng của nhiều người. Bạn có thể thấy avatar được sử dụng bởi chính CodeWisdom  là từ người phụ nữ đặc biệt nên việc những Quote của Grace Hopper luôn nhận được sự mến mộ của người dùng cũng không có gì là lạ.

Niklaus Wirth

Kĩ sư máy tính

“Nguyên nhân chính của sự phức tạp là vì các phần mềm cố gắng cho vào thật nhiều những tính năng mà người dùng muốn có”

Quote của Niklaus Wirth đã tạo nên một hiệu ứng mạnh mẽ đối với người xem của CodeWisdom về vấn đề phức tạp trong lập trình.

Wirth được nhiều người biết tới nhờ vào sự đóng góp của ông trong việc thiết kế những ngôn ngữ lập trình như Pascal, Algol-W Euler.

Andrew Hunt

Nhà văn/Lập trình viên/ Publisher/ Consultant

“Chưa có ai có thể viết được một phần mềm hoàn hảo, bạn cũng vậy”

Là một người có kiến thức sâu rộng, Andy thể hiện rất rõ điều đó qua những Quote của ông vốn cũng rất được đón nhận bởi người dùng từ CodeWisdom.

Cùng với David Thomas, Hunt viết ra cuốn The Pragmatic Programmer and Programming Ruby (có sự cộng tác của Chad Fowler ) được xuất bản tại The Pragmatic Bookshelf. Ngoài ra Hunt cũng là một trong 17 tác giả của cuốn the Agile Manifesto.

Jeremy Keith

Web Developer/ Nhà văn/ Nhạc sĩ

“Java đối với JavaScript cũng giống như Ham đối với Hamster”

Quote được trích ra từ Resilient Web Design của chính Jeremy Keith thu hút khá nhiều sự chú ý từ CodeWisdom followers.

Nhiều người cho rằng nó khá giống với câu nói của Chris Heilmann “Java đối với JavaScript cũng như Car đối với Carpet.”, thậm chí nhiều người dùng còn tự chế theo version của mình.

Oscar Godson

Kĩ sư phần mềm/ Web Developer

“Một trong những kĩ năng lập trình tuyệt nhất mà bạn có thể học được là biết khi nào mình nên bỏ đi một thời gian”

Nhà sáng lập nên YorkshireInteractive và CTO của Vault Oscar, những câu nói của Oscar Godson luôn là lời khuyên quí giá cho giới lập trình nói chung cũng như người dùng của CodeWisdom nói riêng.

Oscar còn là editor của nhiều bài viết nổi bật khác trên Medium như: The JavaScript Collection, How I Write and 5 Programmers Questions

Louis Srygley

“Nếu không có requirements hoặc design thì lập trình cũng chỉ như là nghệ thuật của việc thêm bug vào đoạn trống của text file mà thôi”

Đây là một ví dụ tuyệt vời cho việc miêu tả bản chất của lập trình. Một trong những kiến thức cơ bản mà bạn cần phải biết.

___________________________________________________________________

Một lần nữa chúng tôi vô cùng cảm ơn tất cả các bạn đã follow cũng như like và retweet những câu quote, tương tác với CodeWisdom.

Cảm ơn các bạn đã theo dõi bài viết!

Đừng bỏ lỡ những bài viết hay khác:

Xem thêm việc làm Software Developers hot nhất trên TopDev