Deploy a React Application on Linode

Build a simple, convenient deployment pipeline for #React.js apps on your Linode.

  • Since a basic React app is static (it consists of compiled HTML, CSS, and JavaScript files), it is easy to deploy from a local computer to a Linode using Rsync.
  • This guide shows how to set up your Linode and local machine so that you can easily deploy your app whenever changes are made.
  • Most of the time, this will be , but you can adjust the path and the directory name for your needs: Set permissions for the new directory to allow your regular user account to write to it: – – Ensure your web server is configured to serve from the file…
  • Modify the in your virtual host file: ## Modify this line as well as others referencing the path to your app combined Modify the line starting with in the server block for your site: Restart the web server to apply the changes.
  • This script will check out the master branch of your project on Git, build the app using , and then sync the build files to the remote Linode using Rsync.

Learn to deploy a locally developed React application to your Linode using Rsync.
Continue reading “Deploy a React Application on Linode”

Server Rendering with React and React Router

Server Rendering with React and React Router, by @tylermcginnis  #reactjs #react

  • Now that we get the big picture, let’s work on creating the foundation for what will become a server rendered React Router app.
  • Here’s what the React docs have to say about this – – When you’re just rendering a component with no data, it’s not difficult to have the server rendered and client rendered content be identical – as we saw when we just rendered .
  • You need to make sure that the component is rendered with the same data (or props) on both the client and server.
  • The idea is when a GET request is made to our server, instead of calling immediately, we fetch the popular repositories first and then call it after giving our React app the data.
  • The client because it obviously needs to know which components to render as the user navigates around our app and the server because it needs to know which data to fetch when the user requests a specific path.

Continue reading “Server Rendering with React and React Router”

Continuous Integration for React Native

#Continuousintegration for #ReactNative - match made in heaven! 🛠📱

  • This guide is for you if… – – We will show you how to setup Continuous Integration for React Native builds in just a few clicks using Nevercode.
  • When the scanning completes you’ll be presented with three options: – – The Project selection here means a directory in your repository where your React Native configuration file is stored.
  • Nevercode installs the dependencies listed out in your project’s file automatically using Yarn package manager right after your repository is cloned for building.
  • Signing React Native applications in Nevercode is done just like it is with native Android and iOS applications.
  • With support for React Native, iOS, Android, Cordova and Ionic, Nevercode is truly a mobile developer’s choice to release defect-free mobile apps faster.

One tool to build them all
Continue reading “Continuous Integration for React Native”

Why’s React Native so promising?

Why is #ReactNative so promising? Read Valentin's blog post to find out!

  • React Native looks a lot like React: roughly the same syntax, classes, JSX, state, props… but React Native is a framework, which means you have more features than just rendering in React Native.
  • To do that, the Facebook team created a bunch of APIs to interact with the camera, the keyboard, the vibrations… – – One of the big advantages of using React Native is that, while the core app runs in a JavaScript Engine, it uses JSX to render native code.
  • You use classes, ES6, states and the like, with a few notable differences: – – Not much to say here except that Redux, the React developers’ favourite state management library, also works with React Native with absolutely no difference in the way you’ll dev.
  • Here’s an example of a small Menu component: – – This article is not about HOCs; just know they allow a greater flexibility around the way you compose your components and you can use them in React Native.
  • With React Native you can compose your styles and properties, combine them and then have them applied onto your component.

Continue reading “Why’s React Native so promising?”

Babel · The compiler for writing next generation JavaScript

  • Babel has support for the latest version of JavaScript through syntax transformers.
  • These plugins allow you to use new syntax, right now without waiting for browser support.
  • Check out our env preset to get started.
  • You can install this preset with – – and add to your presets array.

The compiler for writing next generation JavaScript
Continue reading “Babel · The compiler for writing next generation JavaScript”

We’re looking for a Full Stack Developer to join our team. Check the full description here …

  • We work with modern and proven technologies, at competitive rates, focused on quality, but with a wider purpose in mind: The customer goals!
  • Learn more about our services and technologies we work with.
  • In this position you’ll apply your HTML5 / CSS3 / JS skills and learn top modern web technologies such as NodeJS, Express, ReactJS, Redux, Webpack, etc and some of React Native to built Mobile Applications.
  • You will work on Front-End and Back-End tasks to build top-notch products, we look for talented people who want to solve problems for our customers with a good attitude and striving for the quality of their work.
  • We have a lot of exciting projects in the pipeline, so if you want to be part of one of them keep reading and drop us a line.

Do you need software solutions? We can help you!
Continue reading “We’re looking for a Full Stack Developer to join our team. Check the full description here …”

MERN v3.0 is underway 🎉 – Hashnode

  • MERN v3.0 is underway 🎉It’s been a little over a year since we at Hashnode made our boilerplate code available to the community.
  • We have been humbled by the traction which MERN has gotten over the years.
  • Little did we know that our small little side project would become the go-to solution to get started with the MERN stack for the community.
  • While retrospecting our open-source contributions, the need for a new version of MERN came to light, as highlighted by the numerous issues and PR’s that have been raised over the past year to update the repository.It is 2018, and a lot has changed in the React landscape.
  • xMoving from React Router v2 to v4Out of the box Yarn supportUpgrade to Webpack 3 and move to babel-preset-envBring base Node version to v8.x LTS, for all that async-await goodness 😋Have a simpler workflow so that you can start your project(s) with much more ease!You can track the progress and…

It’s been a little over a year since we at Hashnode made our boilerplate code available to the community. We have been humbled by the traction which MERN has gotten over the years. Little did we know…
Continue reading “MERN v3.0 is underway 🎉 – Hashnode”