Mark Odayan markodayan

## gist:41fccf159b897eaee94ce5511bcb67c2
// @desc  Basic boilerplate for server.js file. app set up, set up middleware like dotenv and morgan.use of environment vars

const express = require('express');
const dotenv = require('dotenv');
const morgan = require('morgan');

const bootcamps = require('./routes/bootcamps');

//  Load environment variables
dotenv.config({ path: './config/config.env' });

## rot13.py
#Python Rot13 Encoder

password = input("Enter string to encrypt with Rot13:\n")

# Using the str.maketrans to make a translation key
# Could apply the rot13 encoding scheme
rot13 = str.maketrans(
    "ABCDEFGHIJKLMabcdefghijklmNOPQRSTUVWXYZnopqrstuvwxyz",
    "NOPQRSTUVWXYZnopqrstuvwxyzABCDEFGHIJKLMabcdefghijklm")

## index.html
    <header class="main-header">
      <nav class="transparent z-depth-0">
        <div class="nav-wrapper">
          <a
            href="#"
            data-activates="mobile-nav"
            class="button-collapse show-on-large"
          >
            <i class="material-icons">menu</i>
          </a>

## index.html
<html>
  <body id="home" class="scrollspy">                                                              ********
    <header class="main-header">
      <div class="primary-overlay">
        <div class="navbar-fixed">
          <nav class="transparent">
            <div class="container">
              <div class="nav-wrapper">
                <a href="#home" class="brand-logo">BizLand</a>                                    ********
                <a href="#" data-activates="mobile-nav" class="button-collapse">

## reduxSetup.txt
a Basic redux setup in a React application covering fundamental steps

#1 Create store (using 'redux'), we will pass the root reducer in here later (root reducer contains all other reducers)

#2 Wrap App root element in Provider (from 'react-redux')

#3 Create a root reducer file with reducer function with args of state & action and returning state. define init state
at top of file and feed as state arg
- We can create multiple reducers for different parts of our app to handle their own set of actions and then combine these reducers into one Root Reducer and pass it into the store.
- We can make reducers in their own files, then in the rootReducer file -> use the combineReducers method from 'redux' to combine all the reducers into the rootReducer

## redux-info.txt
We can map things from our Redux stores in App Components:

- State
- Dispatch

## redux-info.js
/* We can map things from our Redux stores in App Components:

- State
- Dispatch
----------- */
// reading Redux store state example:
const mapStateToProps = (state, ownProps) => {
  let id = ownProps.match.params.post_id;
  return {
    post: state.posts.find(post => post.id === id)

## rootReducer.js
// initState defined beforehand in file or wherever and import it

const rootReducer = (state = initState, action) => {
  if (action.type === 'DELETE_POST') {
    let newPosts = state.posts.filter(post => action.id !== post.id);

    return {
      ...state,
      posts: newPosts
    };

## redirect.js
  handleClick = () => {
    this.props.deletePost(this.props.post.id);
    this.props.history.push('/'); // Redirect Action
  };

## react-fundamentals
- Components
- Virtual DOM
- Lifecycle methods
- create-react-app
- HOCs
- Redux and Stores
	// @desc Basic boilerplate for server.js file. app set up, set up middleware like dotenv and morgan.use of environment vars

	const express = require('express');
	const dotenv = require('dotenv');
	const morgan = require('morgan');

	const bootcamps = require('./routes/bootcamps');

	// Load environment variables
	dotenv.config({ path: './config/config.env' });
	#Python Rot13 Encoder

	password = input("Enter string to encrypt with Rot13:\n")

	# Using the str.maketrans to make a translation key
	# Could apply the rot13 encoding scheme
	rot13 = str.maketrans(
	"ABCDEFGHIJKLMabcdefghijklmNOPQRSTUVWXYZnopqrstuvwxyz",
	"NOPQRSTUVWXYZnopqrstuvwxyzABCDEFGHIJKLMabcdefghijklm")
	<header class="main-header">
	<nav class="transparent z-depth-0">
	<div class="nav-wrapper">
	<a
	href="#"
	data-activates="mobile-nav"
	class="button-collapse show-on-large"
	>
	<i class="material-icons">menu</i>
	</a>
	<html>
	<body id="home" class="scrollspy"> ********
	<header class="main-header">
	<div class="primary-overlay">
	<div class="navbar-fixed">
	<nav class="transparent">
	<div class="container">
	<div class="nav-wrapper">
	<a href="#home" class="brand-logo">BizLand</a> ********
	<a href="#" data-activates="mobile-nav" class="button-collapse">
	a Basic redux setup in a React application covering fundamental steps

	#1 Create store (using 'redux'), we will pass the root reducer in here later (root reducer contains all other reducers)

	#2 Wrap App root element in Provider (from 'react-redux')

	#3 Create a root reducer file with reducer function with args of state & action and returning state. define init state
	at top of file and feed as state arg
	- We can create multiple reducers for different parts of our app to handle their own set of actions and then combine these reducers into one Root Reducer and pass it into the store.
	- We can make reducers in their own files, then in the rootReducer file -> use the combineReducers method from 'redux' to combine all the reducers into the rootReducer
	We can map things from our Redux stores in App Components:

	- State
	- Dispatch
	/* We can map things from our Redux stores in App Components:

	- State
	- Dispatch
	----------- */
	// reading Redux store state example:
	const mapStateToProps = (state, ownProps) => {
	let id = ownProps.match.params.post_id;
	return {
	post: state.posts.find(post => post.id === id)
	// initState defined beforehand in file or wherever and import it

	const rootReducer = (state = initState, action) => {
	if (action.type === 'DELETE_POST') {
	let newPosts = state.posts.filter(post => action.id !== post.id);

	return {
	...state,
	posts: newPosts
	};
	handleClick = () => {
	this.props.deletePost(this.props.post.id);
	this.props.history.push('/'); // Redirect Action
	};
	- Components
	- Virtual DOM
	- Lifecycle methods
	- create-react-app
	- HOCs
	- Redux and Stores