Skip to content

Instantly share code, notes, and snippets.

Avatar
🎯
Focusing

Mohan Dere mohandere

🎯
Focusing
View GitHub Profile
@mohandere
mohandere / namespaced-bootstrap-v3.3.7.css
Last active Dec 27, 2017
Namespacing bootstrap 3.3.7
View namespaced-bootstrap-v3.3.7.css
/*! Namespaced Bootstrap 3.3.7
* Load Glyphicons Halflings extrnally
* Bootstrap v3.3.7 (http://getbootstrap.com)
* Copyright 2011-2016 Twitter, Inc.
* Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
*/
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
html {
font-family: sans-serif;
@mohandere
mohandere / store.js
Last active Feb 15, 2018
Getting started with create-react-app, Redux, React Router, Redux observable & React Bootstrap(reactstrap)
View store.js
import { createStore, applyMiddleware } from 'redux';
import { createEpicMiddleware } from 'redux-observable';
import createHistory from 'history/createHashHistory';
import { routerMiddleware } from 'react-router-redux';
// import root epic/reducer
import rootEpic from './rootEpic';
import rootReducer from './rootReducer';
import queryString from 'query-string';
View rootReducer.js
import { combineReducers } from 'redux';
import { routerReducer } from 'react-router-redux';
import {
reducer as toastrReducer
} from 'react-redux-toastr'
import common from './common/reducers';
import catalog from './catalog/reducers';
import home from './home/reducers';
import product from './product/reducers';
View rootEpic.js
import {
combineEpics
} from 'redux-observable';
// Import feature wise epic
import common from './common/epics';
import catalog from './catalog/epics';
import home from './home/epics';
import archives from './archives/epics';
@mohandere
mohandere / index.js
Last active Feb 16, 2018
routes.js + index.js
View index.js
// File - src/index.js
import React from 'react';
import ReactDOM from 'react-dom';
import registerServiceWorker from './registerServiceWorker';
import { Provider } from 'react-redux';
import { ConnectedRouter } from 'react-router-redux';
// Import store and history
import store, { history } from './store';
@mohandere
mohandere / epicGetProducts.js
Last active Feb 16, 2018
Epic getProducts.js
View epicGetProducts.js
import {
ajax
} from 'rxjs/observable/dom/ajax';
import 'rxjs/add/operator/catch'
import 'rxjs/add/operator/debounceTime'
import queryString from 'query-string'
import {
Observable
} from 'rxjs/Observable';
@mohandere
mohandere / index.js
Last active Feb 19, 2018
react-router-redux integration example
View index.js
// src/index.js
import createHistory from 'history/createBrowserHistory'
import { ConnectedRouter, routerReducer } from 'react-router-redux'
import { Route } from 'react-router'
import { Provider } from 'react-redux'
// Other imports ...
// Add the reducer to your store on the `router` key
// Also apply our middleware for navigating
@mohandere
mohandere / UserRepos.js
Last active Feb 19, 2018
UserRepos.js - Container component example
View UserRepos.js
// File- src/home/containers/UserRepos.js
import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux'
// Import dumb component
import Repo from '../components/Repo';
// Actions
import { doUserRepos } from '../actions/doUserRepos';
@mohandere
mohandere / epicGetUserRepos.js
Last active Feb 19, 2018
Epic get github user repos
View epicGetUserRepos.js
import { ajax } from 'rxjs/observable/dom/ajax';
import 'rxjs/add/operator/catch'
import {
REQUEST_USER_REPOS_START
} from '../actions/actionTypes';
import {
doUserReposFulfilled,
doUserReposFailed
} from '../actions/doUserRepos';
@mohandere
mohandere / vue-infinite-loader.vue
Created Dec 1, 2017
Infinite Loading with Vue.js
View vue-infinite-loader.vue
<template>
<main class="container">
<div>
<header>
<h3>Archives</h3>
</header>
<div v-if="posts && posts.length" class="postsList">
<ul class="row">
<li v-for="(post, index) in posts" class="postItem col-sm-4">
<div class="postContent">
You can’t perform that action at this time.