initial commit: bootstrap, organize app skeleton
Avraham Sakal
6 months ago
commit
a1e44c5d45
@ -0,0 +1,24 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
@ -0,0 +1,3 @@
|
||||
nodejs 20.15.1
|
||||
# python 3.12.4
|
||||
pnpm 9.7.1
|
||||
@ -0,0 +1,16 @@
|
||||
{
|
||||
"$schema": "https://biomejs.dev/schemas/1.8.3/schema.json",
|
||||
"organizeImports": {
|
||||
"enabled": true
|
||||
},
|
||||
"formatter": {
|
||||
"indentWidth": 2,
|
||||
"indentStyle": "space"
|
||||
},
|
||||
"linter": {
|
||||
"enabled": true,
|
||||
"rules": {
|
||||
"recommended": true
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,14 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" type="image/svg+xml" href="/vite.svg" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<meta name="color-scheme" content="light dark" />
|
||||
<title>Tech Blog</title>
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
<script type="module" src="/src/index.tsx"></script>
|
||||
</body>
|
||||
</html>
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,23 @@
|
||||
{
|
||||
"private": true,
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@emotion/react": "^11.13.3",
|
||||
"@emotion/styled": "^11.13.0",
|
||||
"@fontsource/roboto": "^5.1.0",
|
||||
"@mui/material": "^6.1.6",
|
||||
"preact": "^10.13.1",
|
||||
"preact-iso": "^2.3.2",
|
||||
"preact-render-to-string": "^6.3.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@preact/preset-vite": "^2.5.0",
|
||||
"typescript": "^5.3.3",
|
||||
"vite": "^5.4.10"
|
||||
}
|
||||
}
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
||||
|
After Width: | Height: | Size: 1.5 KiB |
@ -0,0 +1,14 @@
|
||||
import { Container } from "@mui/material";
|
||||
import { SearchHeader } from "./SearchHeader/SearchHeader";
|
||||
import { SearchResults } from "./SearchResults/SearchResults";
|
||||
import { ChosenArticle } from "./ChosenArticle/ChosenArticle";
|
||||
|
||||
export function Blog() {
|
||||
return (
|
||||
<Container class="blog">
|
||||
<SearchHeader />
|
||||
<SearchResults />
|
||||
<ChosenArticle />
|
||||
</Container>
|
||||
);
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
import Box from "@mui/material/Box";
|
||||
|
||||
export function ChosenArticle() {
|
||||
return <Box class="chosen-article"></Box>;
|
||||
}
|
||||
@ -0,0 +1,12 @@
|
||||
import Box from "@mui/material/Box";
|
||||
import { SearchRow } from "./SearchRow/SearchRow";
|
||||
import { TagCloud } from "./TagCloud/TagCloud";
|
||||
|
||||
export function SearchHeader() {
|
||||
return (
|
||||
<Box class="search-header">
|
||||
<SearchRow />
|
||||
<TagCloud />
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
export function Logo() {
|
||||
return <img class="logo"></img>;
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
export function SearchButton() {
|
||||
return <Button class="search-button">Search</Button>;
|
||||
}
|
||||
@ -0,0 +1,14 @@
|
||||
import Box from "@mui/material/Box";
|
||||
import { Logo } from "./Logo/Logo";
|
||||
import { SearchTextBox } from "./SearchTextBox/SearchTextBox";
|
||||
import { SearchButton } from "./SearchButton/SearchButton";
|
||||
|
||||
export function SearchRow() {
|
||||
return (
|
||||
<Box class="search-row">
|
||||
<Logo />
|
||||
<SearchTextBox />
|
||||
<SearchButton />
|
||||
</Box>
|
||||
);
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
export function SearchTextBox() {
|
||||
return <TextField class="search-text-box"></TextField>;
|
||||
}
|
||||
@ -0,0 +1,3 @@
|
||||
export function TagCloud() {
|
||||
return <Box class="tag-cloud"></Box>;
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
import Box from "@mui/material/Box";
|
||||
|
||||
export function SearchResults() {
|
||||
return <Box class="search-results"></Box>;
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
export function NotFound() {
|
||||
return (
|
||||
<section>
|
||||
<h1>404: Not Found</h1>
|
||||
<p>It's gone :(</p>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
@ -0,0 +1,27 @@
|
||||
import { render } from "preact";
|
||||
import { LocationProvider, Router, Route } from "preact-iso";
|
||||
|
||||
import { Header } from "./components/Header.jsx";
|
||||
import { Blog } from "./Blog/Blog.js";
|
||||
import { NotFound } from "./_404.js";
|
||||
import "./style.css";
|
||||
import "@fontsource/roboto/300.css";
|
||||
import "@fontsource/roboto/400.css";
|
||||
import "@fontsource/roboto/500.css";
|
||||
import "@fontsource/roboto/700.css";
|
||||
|
||||
export function App() {
|
||||
return (
|
||||
<LocationProvider>
|
||||
<Header />
|
||||
<main>
|
||||
<Router>
|
||||
<Route path="/" component={Blog} />
|
||||
<Route default component={NotFound} />
|
||||
</Router>
|
||||
</main>
|
||||
</LocationProvider>
|
||||
);
|
||||
}
|
||||
|
||||
render(<App />, document.getElementById("app"));
|
||||
@ -0,0 +1,22 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2020",
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"noEmit": true,
|
||||
"allowJs": true,
|
||||
"checkJs": true,
|
||||
|
||||
/* Preact Config */
|
||||
"jsx": "react-jsx",
|
||||
"jsxImportSource": "preact",
|
||||
"skipLibCheck": true,
|
||||
"paths": {
|
||||
"react": ["./node_modules/preact/compat/"],
|
||||
"react/jsx-runtime": ["./node_modules/preact/jsx-runtime"],
|
||||
"react-dom": ["./node_modules/preact/compat/"],
|
||||
"react-dom/*": ["./node_modules/preact/compat/*"]
|
||||
}
|
||||
},
|
||||
"include": ["node_modules/vite/client.d.ts", "**/*"]
|
||||
}
|
||||
@ -0,0 +1,7 @@
|
||||
import { defineConfig } from 'vite';
|
||||
import preact from '@preact/preset-vite';
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [preact()],
|
||||
});
|
||||
Loading…
Reference in New Issue