Ulises Giacoman ugiacoman

Whether your component relies on client-side features or you are using 3rd party components that are not designed for server-side rendering, sometimes you'll want to defer rendering until on the client. For our example, we'll be using react-chart-2 to load a Doughnut chart.

You'll need a next project and to install chart.js + react-chartjs-2.

$ npm install --save chart.js react-chartjs-2

	# Your init script
	#
	# Atom will evaluate this file each time a new window is opened. It is run
	# after packages are loaded/activated and after the previous editor state
	# has been restored.
	#
	# An example hack to log to the console when each text editor is saved.
	#
	# atom.workspace.observeTextEditors (editor) ->
	# editor.onDidSave ->

	import React, { PropTypes } from 'react'

	export default class Navbar extends React.Component {

	static propTypes = {
	scale: PropTypes.string,
	}

	static defaultProps = {
	scale: '1.0',

	const { parse } = require('url')
	const next = require('next')
	const pathMatch = require('path-match')
	const express = require('express')
	const compression = require('compression')

	require('dotenv').config()

	const dev = process.env.NODE_ENV !== 'production'
	const app = next({ dev })

	-- this is an example

	group: nameOfTheNewGroup


	employee = {
	person_name:string, street:string, city:string
	'ricky' , '42' , 'alexandria'
	'donald' , '34' , 'dc'
	'bob' , '23' , 'alexandria'

	<!DOCTYPE html>
	<html>
	<head>
	<title>Foo</title>
	<meta charset='utf-8' />
	<meta name='viewport' content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0' />
	<style type='text/css'>
	body {
	font-family: 'Helvetica';
	letter-spacing:-5px;