James Huynh My little tech blog

React Nested Form with Rails

We used to build nested form in Rails using Rails helper. However, due to the demand of moving to React JS, we would also love to be able to build nested form in React JS, yet we should still able to utilise all the lovely facility & standard provided by Rails. In this article, I will go through an example on how we build a nested form with Project & Task, i.e. one project can have many tasks and we can keep adding task in the same form as the project.

Build Chat with React JS and Rails Action Cable

Rails 5 comes up with Action Cable and it is a wonderful feature as usually to do a real time feature, we would need to rely on NodeJS to have implement a websocket. By combining with React JS on front end, we can easily build a chat application with Rails backend API and React JS front end to render the chat messages. In this article, let go through how to implement this solution.

Nested Model Form

Rails’s abilty to build form quickly is great. However, ability to create a nested model form is not intuitive. This kind of task looks hard at first but if you know how to do it, it is pretty simple. In this article, I will quickly go through how we can build nested model form in Rails just by using jQuery.

Make your javascript application and single page application crawlable by search engine

With the growth of javascript frameworks and libraries like ReactJS, AngularJS, EmberJS, etc…, javascript application is a trend now. A lot of developers have switched from using a Rails, PHP or Java to do frontend application to use these mentioned javascript frameworks and libraries. However, there is a major drawback by using these framework, that is your frontend application would not be easily crawled by a search engine like Google, Yahoo or Bing. In this article, I would like to outline a solution that I have experimented on a javascript app to make the frontend app crawlable regardless of which javascript frameworks or libraries that are used.

Reduce database query in N+1 problem

During development with rails, we tend to call relationship freely like post.comments.count. This is usually fine. However, when we call this in a loop and go thorough an array of posts, it will cause a lot of queries into database and make the app slow down. In this article, we would go through some solutions on how to solve this problem and make our app faster.

Secure Single Page Application for Nginx and Apache

Single Page Application (SPA) is pretty easy to deploy on nginx or apache server. However, after deploying, we would need to add a few things so that our application can be more secured to some possible attacks. In this article, I am going to go through some of the security threat that I know and the solution to prevent those threats in nginx and apache server.

Fix head font cut off for iOS

iOS development is great if we use the default font. However, it is a bit buggy when we use a custom font. In my case, I find one particular font that has the top of the font chopped off. In this article, I would like to share how I can fix that

Integrate with IBM Softlayer Object Storage

IBM SoftLayer Object Storage is a service exactly like Amazon Simple Storage Service (Amazon S3). It provides storage layer so that we can persist our file securely on the cloud. I have a chance to work with IBM Softlayer Object Storage during integration with our Rails app. IBM Softlayer Object Storage is relatively new and there are little materials regarding how to do this integration. In this article, I will wlkthrough how we use IBM Softlayer Object Storage to store and retrieve file by making use of Rails and Carrierwave gem.

Capistrano Deployment Behind a Proxy

It’s best if we can deploy our app into an online VPS. However, sometimes we would still need to deploy our app to a server behind a VPN. In this article, I would like to share how we can setup to ease the process of installing gems, gem bundling and git clone / push in a server behind a VPN

Getting Started with ReactJS

ReactJS is a library created by Facebook. It is getting hot and more and more popular recently. One of the great companion of ReactJS is Webpack, which can tremendously help to speed up and ease the coding of ReactJS.

In this article, I would like to introduce how we can get started with the combination of Webpack and ReactJS. This would cover some basic setup and how we can start using ReactJS to develop a web app straight away.