Skip to content

Instantly share code, notes, and snippets.

View mohanramphp's full-sized avatar

Mohan Ram mohanramphp

View GitHub Profile
@mohanramphp
mohanramphp / DateTime.js
Created January 9, 2019 08:52
DateTime Component using React hooks
import React, { useState, useEffect } from 'react';
export const DateTime = () => {
const [dateTime, setDateTime] = useState(new Date());
useEffect(() => {
const id = setInterval(() => setDateTime(new Date()), 1000);
return () => {
clearInterval(id);
}
const students = ["Mohan", "Ram", "Jeeva", "Priya"];
//since students object is an iterable, we can use with iteration mechanism such as for, spread operators etc.
for (let student of students) {
console.log(student);
}
// prints
// "Mohan"
// "Ram"
// "Jeeva"
@mohanramphp
mohanramphp / Login.js
Last active May 24, 2020 12:04
Login Component using React
import React, { useState } from "react";
import { useHistory } from "react-router-dom";
import styles from "./Login.module.css";
import { useForm } from "react-hook-form";
import { Link } from "react-router-dom";
import config from "../../config";
const Login = () => {
@mohanramphp
mohanramphp / Register.js
Last active May 24, 2020 12:01
Complete Registration Form using React
import React, { useState } from "react";
import styles from "./Register.module.css";
import { useForm } from "react-hook-form";
import { Link } from "react-router-dom";
import config from "../../config";
const Register = () => {
const { register, handleSubmit, errors } = useForm();
const [message, setMessage] = useState();
@mohanramphp
mohanramphp / Dashoard.js
Created May 24, 2020 09:53
React Dashboard Component
import React, { useEffect, useState } from "react";
import { useHistory } from "react-router-dom";
import config from "../../config";
const Dashboard = () => {
const [dashboard, setDashboard] = useState(null);
const history = useHistory();
const logout = () => {
@mohanramphp
mohanramphp / Login.module.css
Created May 24, 2020 08:03
Login Component CSS
.container {
height: 100vh;
}
.loginFormContainer {
width: 24rem;
}
.loginFormLegend {
width: 14rem;
@mohanramphp
mohanramphp / Register.module.css
Created May 24, 2020 05:40
React Register Component holding styles for our component template
.container {
height: 100vh;
}
.registrationFormContainer {
width: 24rem;
}
.registrationFormLegend {
width: 14rem;
@mohanramphp
mohanramphp / Register.js
Created May 24, 2020 05:40
React Register Component holding static template for user registration
import React from "react";
import styles from "./Register.module.css";
import { Link } from "react-router-dom";
const Register = () => (
<div
className={`${styles.container} container-fluid d-flex align-items-center justify-content-center`}
>
<div className={styles.registrationFormContainer}>
@mohanramphp
mohanramphp / registration.js
Created May 16, 2020 10:18
controller part for registration
const router = require("express").Router();
const User = require("../model/User");
const bcrypt = require("bcryptjs");
// validation
const { registerValidation, loginValidation } = require("../validation");
// register route
router.post("/register", async (req, res) => {
// validate the user
@mohanramphp
mohanramphp / User.js
Created May 16, 2020 07:13
User model declaration
const mongoose = require("mongoose");
const userSchema = new mongoose.Schema({
name: {
type: String,
required: true,
min: 6,
max: 255,
},
email: {