Skip to content

Instantly share code, notes, and snippets.

View TRomesh's full-sized avatar
👊
Win or Learn

Tharaka Romesh TRomesh

👊
Win or Learn
View GitHub Profile
import React, { useState } from "react";
import styled from "styled-components";
import Message from "./Message";
const FormContainer = styled.div`
display: flex;
flex-direction: column;
align-items: center;
margin-top: 100px;
`;
@TRomesh
TRomesh / AsyncState.js
Last active May 18, 2021 04:07
Handling Asynchronous state
const fetchResource = () => fetch('https://pokemons.com').then(r => r.json())
const state = useState(fetchResource);
if (state.promised) {
return <p>Loading {resourcePath}</p>;
}
if (state.error) {
return (<p>
Failed to load {resourcePath}
@TRomesh
TRomesh / store.js
Last active May 17, 2021 16:53
Store for Pokémon application with Hookstate
import { Persistence } from '@hookstate/persistence';
import { createState, useState, none } from '@hookstate/core'
const store = createState({
pokemon: { name: '', power: '', description: '' },
pokemons: [{ id: 1, name: 'pikachu', power: 'fire', description: 'fluffy' }],
isEditing: false,
})
const useGlobalState = () => {
@TRomesh
TRomesh / PokemonList.jsx
Last active May 17, 2021 16:52
List Component for Pokémon application with Hookstate
import useGlobalState from "../store"
import { List, ListItem, ListIcon, ListContent, ListHeader, ListDescription, Segment } from 'semantic-ui-react'
function Row({ id, name, power, description, selectPokemon, deletePokemon }) {
return (
<ListItem>
<ListIcon name="trash alternate outline" onClick={() => deletePokemon(id)}></ListIcon>
<ListIcon name="edit outline" onClick={() => selectPokemon({ id, name, power, description })}></ListIcon>
<ListContent>
<ListHeader as="h3">{name}</ListHeader>
@TRomesh
TRomesh / PokemonForm.jsx
Created May 17, 2021 16:50
Form Component for Pokémon application with Hookstate
import { useEffect } from "react";
import { useState } from '@hookstate/core';
import useGlobalState from "../store"
import { Form, FormField, Header, Input, Button, Segment } from 'semantic-ui-react'
const initialState = { name: '', power: '', description: '' }
function PokemonForm() {
const state = useGlobalState();
@TRomesh
TRomesh / install-oh-my-zsh-on-ubuntu
Created June 8, 2017 18:04 — forked from richardtape/install-oh-my-zsh-on-ubuntu
Install Oh My ZSH on Ubuntu 14.04
# Where is the location of your current shall. Useful if we need to revert
echo $0
# Install ZSH
sudo apt-get install zsh
# Instal GIT
sudo apt-get install git-core
# Install OhMyZSH
// Redux action
export function uploadSuccess({ data }) {
return {
type: 'UPLOAD_DOCUMENT_SUCCESS',
data,
};
}
export function uploadFail(error) {
return {
import express from 'express';
import axios from 'axios';
import multer from 'multer';
const app = express();
/**
... express.js boilerplate
routes, middlewares, helpers, loggers, etc
**/
@TRomesh
TRomesh / bashrc.md
Created May 10, 2017 06:45 — forked from ankurk91/bash_profile.md
:octocat: Git branch name in Linux Terminal

Git tip: Show your branch name on your Linux terminal

Add these lines in your ~/.bashrc file

# Show git branch name
force_color_prompt=yes
color_prompt=yes
parse_git_branch() {