cziem

render() {
    return (
      <main>
        <Route path="/*" component={my404} />
      </main>
    )
  }

cziem

export default class Menu extends React.Component {
  render() {
    return (
      <div className="menu">
        <ul>
          <li>Home</li>
          <li>Events</li>
          <li>Pricing</li>
          <li>About</li>
        </ul>

cziem

import React from 'react';

const Menu = () => (
  <div className="menu">
    <ul>
      <li>Home</li>
      <li>Events</li>
      <li>Pricing</li>
      <li>About</li>
    </ul>

cziem

body {
  margin: 2rem;
  padding-top: 12rem;
  background-color: #ddd;
}

cziem

// using regex
function palindrome(str) {
let regx = /[\W_]/g; //[^A-Za-z0-9]/g;
let lowRegx = str.toLowerCase().replace(regx, '');
let reverseLowRegx = lowRegx.split('').reverse().join('');

(lowRegx === reverseLowRegx) ? alert(`${str} is a palindrome : ${reverseLowRegx}`) : alert(`${str} is not a palindrome : ${reverseLowRegx}`);
}

let userStr = prompt("Enter a word to test for palindrome");

cziem

// Method 1
const reverseString = str => {
  let newString = "";
  for (let char of str) {
    newString = char + newString;
  }
  return newString;
};

// method 2 using reduce

cziem

// create state
const formDetails = {
  user: {
    fullname: "",
    username: "",
    email: "",
    password: "",
    rePassword: "",
    occupation: ""
  },

cziem

<div class="main">
  <header id="header" class="header">
    <div class="logo">
      <img id="header-img" src="https://2rbfd03pmmcu3pkvqf1xl71z-wpengine.netdna-ssl.com/wp-content/uploads/2017/01/logo.png" alt="CW logo"> <span>courseWare</span>
    </div>
    
    <nav id="nav-bar">
      <ul>
        <li>
          <a class="nav-link" href="#courses">Courses</a>

cziem

<div class="main">
  <header id="header" class="header">
    <div class="logo">
      <img id="header-img" src="https://2rbfd03pmmcu3pkvqf1xl71z-wpengine.netdna-ssl.com/wp-content/uploads/2017/01/logo.png" alt="CW logo"> <span>courseWare</span>
    </div>
    
    <nav id="nav-bar">
      <ul>
        <li>
          <a class="nav-link" href="#courses">Courses</a>

cziem

@media (max-width: 680px) {
  header {
    flex-direction: column !important;
    nav {
      margin-top: 1rem;
    }
  }
  
  .course, .pricing {
    height: auto;