Skip to content

Instantly share code, notes, and snippets.

Avatar

Ulises Giacoman ugiacoman

View GitHub Profile
View init.coffee
# 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 ->
View logo.js
import React, { PropTypes } from 'react'
export default class Navbar extends React.Component {
static propTypes = {
scale: PropTypes.string,
}
static defaultProps = {
scale: '1.0',
@ugiacoman
ugiacoman / server.js
Created Mar 30, 2017
next.js + custom server + api ; nasty I know :)
View server.js
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 })
@ugiacoman
ugiacoman / Client-Loading-Example.md
Last active May 23, 2020
SSR + CSR using next.js
View Client-Loading-Example.md

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.

Doughnut

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

$ npm install --save chart.js react-chartjs-2  
View samplequery
-- this is an example
group: nameOfTheNewGroup
employee = {
person_name:string, street:string, city:string
'ricky' , '42' , 'alexandria'
'donald' , '34' , 'dc'
'bob' , '23' , 'alexandria'
View index.html
<!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;
View index.html
<!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;
View index.html
<!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;
View index.html
<!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;
View index.html
<!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;
You can’t perform that action at this time.