Skip to content

Instantly share code, notes, and snippets.

View techomoro's full-sized avatar

Techomoro techomoro

View GitHub Profile
import React, { useEffect } from "react";
import { useParams } from "react-router";
function Post() {
let { postSlug } = useParams();
useEffect(() => {
// Fetch post using the postSlug
}, [postSlug]);
import React from "react";
import { Link } from "react-router-dom";
function Posts() {
return (
<div className="home">
<div class="container">
<Link to="/blog/this-is-a-post-title">
<div class="row align-items-center my-5">
<div class="col-lg-7">
import React from "react";
import { Outlet } from "react-router-dom";
function Blog() {
return (
<div className="home">
<div class="container">
<h1 className="text-center mt-5">Blog page</h1>
<Outlet />
</div>
import Navigation from "../components/Navigation";
export default function Home() {
return (
<div>
<Navigation />
{/* Dummy data */}
<div style={{ marginTop: "7rem" }}>
<section id="home">
import "../styles/globals.css";
import "bootstrap/dist/css/bootstrap.css";
function MyApp({ Component, pageProps }) {
return <Component {...pageProps} />;
}
export default MyApp;
import { useEffect, useState } from "react";
export default function Navigation() {
const [clientWindowHeight, setClientWindowHeight] = useState("");
const [backgroundTransparacy, setBackgroundTransparacy] = useState(0);
const [padding, setPadding] = useState(30);
const [boxShadow, setBoxShadow] = useState(0);
.main {
text-align: center;
margin-top: 10rem;
}
input {
height: 2rem;
width: 20rem;
border: 1px solid #c9c9c9;
font-size: 1.2em;
padding: 0.3rem;
import React from "react";
import InputComponent from "../components/InputComponent";
import LengthComponent from "../components/LengthComponent";
export default function Main() {
return (
<div className="main">
<InputComponent />
<LengthComponent />
</div>
import "../styles/globals.css";
import { RecoilRoot } from "recoil";
function MyApp({ Component, pageProps }) {
return (
<div>
<RecoilRoot>
<Component {...pageProps} />
</RecoilRoot>
</div>
.main {
text-align: center;
margin-top: 10rem;
}
input {
height: 2rem;
width: 20rem;
border: 1px solid #c9c9c9;
font-size: 1.2em;
padding: 0.3rem;