Merge pull request #46 from dakshgupta2002/main

Post request to add minified alias
This commit is contained in:
Jyotirmoy Bandyopadhayaya 2022-02-12 22:27:01 +05:30 committed by GitHub
commit 576db6522c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 60 additions and 32 deletions

View File

@ -1,4 +1,5 @@
const express = require('express')
const cors = require('cors');
const http = require('http')
const { urlencoded, json } = require('body-parser')
const session = require('express-session')
@ -9,6 +10,7 @@ require('dotenv').config()
const app = express()
app.use(express.json())
app.use(cors());
app.use(json())
app.use(
urlencoded({

View File

@ -3,55 +3,80 @@ import React from 'react';
import { render } from 'react-dom';
import HomeSectionStyle from "./HomeSection.style";
import Link from 'next/link';
import { nanoid } from 'nanoid';
const head={
fontSize:'5rem',
fontWeight:'bold',
marginBottom:'30px'
const head = {
fontSize: '5rem',
fontWeight: 'bold',
marginBottom: '30px'
};
const box={
fontSize:'1.5em',
borderRadius:'50px',
padding:'1em',
const box = {
fontSize: '1.5em',
borderRadius: '50px',
padding: '1em',
width: '500px',
height:'50px'
height: '50px'
};
const btn={
fontWeight:'bold',
position:'absolute',
const btn = {
fontWeight: 'bold',
position: 'absolute',
alignItems: 'center',
right: '0px',
marginRight:'5px',
marginTop:'4.5px',
marginBottom:'3px',
marginRight: '5px',
marginTop: '4.5px',
marginBottom: '3px',
height: '40px',
width: '100px',
width: '100px',
borderRadius: '50px'
};
const searchBox={
const searchBox = {
position: 'relative',
};
function HomeSection(props) {
const setMinfy = async () => {
const res = await fetch('http://localhost:5000/minify/add', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Access-Control-Allow-Origin': '*'
},
body: JSON.stringify({
alias: nanoid(5),
originalUrl: props.longUrl
}),
});
if (res===null) {
console.log("error");
return;
}
const data = await res.json();
props.setShortUrl(data.minifiedUrl);
navigator.clipboard.writeText(props.shortUrl);
}
return (
<HomeSectionStyle>
<div className="content">
<h1 style={head} className="title">
URL MINIFY
</h1>
<div style={searchBox}>
<input style={box}placeholder="Enter the url to be minified......"/>
<button style={btn} id="minify">MINIFY</button>
</div>
<div>
<h3>Need more advanced features? | <Link href="/signup">Create an account</Link></h3>
</div>
</div>
<div style={searchBox}>
<input style={box} placeholder="Enter the url to be minified......" value={props.longUrl} onChange={(e) => { props.setLongUrl(e.target.value) }} />
<button style={btn} id="minify" onClick={setMinfy}>MINIFY</button>
</div>
<div>
<h3>Need more advanced features? | <Link href="/signup">Create an account</Link></h3>
</div>
</div>
</HomeSectionStyle>
);
}

View File

@ -18,6 +18,7 @@
"@mui/icons-material": "^5.3.1",
"@mui/material": "^5.4.0",
"@mui/styled-engine-sc": "^5.3.0",
"nanoid": "^3.2.0",
"next": "12.0.9",
"react": "17.0.2",
"react-dom": "17.0.2",

View File

@ -7,7 +7,7 @@ import Features from 'components/Features'
export default function Home() {
const [shortUrl, setShortUrl] = useState(null)
const [longURL, setLongURL] = useState('')
const [longUrl, setLongUrl] = useState('')
return (
<div className={""}>
<Head>
@ -17,7 +17,7 @@ export default function Home() {
<main className={"main-bg"}>
<NavBar />
<HomeSection />
<HomeSection shortUrl={shortUrl} setShortUrl={setShortUrl} longUrl={longUrl} setLongUrl={setLongUrl}/>
<Features/>
</main>
</div>