Commit 6b9b11d7 authored by Frank Bessou's avatar Frank Bessou 🍁
Browse files

feat: bootstrap nextjs application

Copy/paste of the current cubicweb.org's home page.
parent 9038840b1dca
Pipeline #110188 passed with stage
in 3 minutes and 1 second
{
"presets": [
"next/babel"
],
"plugins": [
[
"styled-components",
{
"ssr": true,
"displayName": true,
"preprocess": false
}
]
]
}
{
"extends": "next/core-web-vitals"
}
before_script:
- yarn install --cache-folder .yarn
cache:
key: ${CI_COMMIT_REF_SLUG}
paths:
- .yarn
- .next/cache/
build:
stage: build
except:
refs:
- branch/default
image: node:lts-alpine
variables:
BASE_PATH: /-/cubicweb.org/-/jobs/$CI_JOB_ID/artifacts/out
script:
- yarn build
- yarn export
artifacts:
paths:
- out
expire_in: 1 week
pages:
stage: deploy
only:
refs:
- branch/default
image: node:lts-alpine
variables:
BASE_PATH: /cubicweb.org
script:
- yarn build
- yarn export
- rm -r public
- mv out public
artifacts:
paths:
- public
node_modules
.next
out
# cubicweb.org
Future version of cubicweb.org.
\ No newline at end of file
Future version of cubicweb.org.
This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
## Getting Started
First, run the development server:
```bash
npm run dev
# or
yarn dev
```
Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
You can start editing the page by modifying `pages/index.tsx`. The page auto-updates as you edit the file.
[API routes](https://nextjs.org/docs/api-routes/introduction) can be accessed on [http://localhost:3000/api/hello](http://localhost:3000/api/hello). This endpoint can be edited in `pages/api/hello.ts`.
The `pages/api` directory is mapped to `/api/*`. Files in this directory are treated as [API routes](https://nextjs.org/docs/api-routes/introduction) instead of React pages.
## Learn More
To learn more about Next.js, take a look at the following resources:
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
## Deploy on Vercel
The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
/// <reference types="next" />
/// <reference types="next/types/global" />
/// <reference types="next/image-types/global" />
// NOTE: This file should not be edited
// see https://nextjs.org/docs/basic-features/typescript for more information.
/** @type {import('next').NextConfig} */
const config = {
reactStrictMode: true,
images: {
loader: "custom",
},
webpack: (config) => {
config.module.rules.push(
{
test: /\.svg$/,
resourceQuery: { not: /component/ },
type: "asset",
},
{
test: /\.svg$/,
resourceQuery: /component/,
use: ["@svgr/webpack"],
}
);
return config;
},
};
if (process.env.CI !== undefined) {
config.basePath = process.env.BASE_PATH;
}
module.exports = config;
{
"name": "cubicweb-org",
"private": true,
"scripts": {
"dev": "next dev",
"export": "next export",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@types/styled-components": "^5.1.15",
"next": "12.0.4",
"react": "17.0.2",
"react-dom": "17.0.2",
"styled-components": "^5.3.3"
},
"devDependencies": {
"@svgr/webpack": "^6.0.0-alpha.4",
"@types/node": "16.11.7",
"@types/react": "17.0.34",
"babel-plugin-styled-components": "^1.13.3",
"eslint": "7",
"eslint-config-next": "12.0.3",
"typescript": "4.4.4"
}
}
import "../styles/globals.css";
import "../styles/pictogram.css";
import type { AppProps } from "next/app";
function MyApp({ Component, pageProps }: AppProps) {
return <Component {...pageProps} />;
}
export default MyApp;
import type { NextPage } from "next";
import Image from "next/image";
import Head from "next/head";
import styled from "styled-components";
import logo from "../public/logo-cubicweb.svg";
import rssButton from "../public/rss-button.png";
import doapButton from "../public/doap-button.png";
import dublincoreButton from "../public/dublincore-button.png";
import siocButton from "../public/sioc_button.gif";
import microformatsButton from "../public/microformats-button.png";
import foafprojectButton from "../public/foafproject.gif";
import jsonButton from "../public/json-button.png";
const Home: NextPage = () => {
return (
<>
<Head>
<title>CubicWeb Semantic Web Framework</title>
</Head>
<Wrapper>
<Title>
<Logo />
</Title>
<NavList id="navlist">
<ul>
<li>
<a
className="icon-install"
href="https://cubicweb.readthedocs.io/en/default/book/admin/setup"
title="Install"
>
Install
</a>
</li>
<li>
<a
className="icon-book"
href="https://cubicweb.readthedocs.io/en/default/"
title="Read the book"
>
Read the book
</a>
</li>
<li>
<a
className="icon-tools"
href="https://forge.extranet.logilab.fr/cubicweb/cubicweb"
title="Develop at the forge"
>
Develop at the forge
</a>
</li>
</ul>
</NavList>
<Content id="content">
<h1>CubicWeb - The Semantic Web is a construction game!</h1>
<p>
<cite>CubicWeb</cite> is a semantic web application framework,
licensed under the LGPL, that empowers developers to efficiently
build web applications by reusing components (called{" "}
<cite>cubes</cite>) and following the well known object-oriented
design principles.
</p>
<p></p>
<p>Its main features are:</p>
<ul>
<li>
an engine driven by the explicit{" "}
<a href="https://cubicweb.readthedocs.io/en/default/book/devrepo/datamodel/definition/#datamodel-definition">
data model
</a>{" "}
of the application,
</li>
<li>
a query language named{" "}
<a href="https://cubicweb.readthedocs.io/en/default/book/annexes/rql/">
RQL
</a>{" "}
similar to W3C’s SPARQL,
</li>
<li>
a{" "}
<a href="https://cubicweb.readthedocs.io/en/default/tutorials/base/customizing-the-application/#tutosbasecustomizingtheapplicationcustomviews">
selection+view
</a>{" "}
mechanism for semi-automatic XHTML/XML/JSON/text generation,
</li>
<li>
a library of reusable{" "}
<a href="https://cubicweb.readthedocs.io/en/default/book/intro/concepts/#cube">
components
</a>{" "}
(data model and views) that fulfill common needs,
</li>
<li>
the power and flexibility of the Python programming language,
</li>
<li>
the reliability of SQL databases, LDAP directories, Subversion and
Mercurial for storage backends.
</li>
</ul>
<p>
Built since 2000 from an R&amp;D effort still continued, supporting
100,000s of daily visits at some production sites,{" "}
<cite>CubicWeb</cite> is a proven end to end solution for semantic
web application development that promotes quality, reusability and
efficiency.
</p>
<Exits id="exits">
{" "}
<p>
The unbeliever will read the{" "}
<a href="https://cubicweb.readthedocs.io/en/default/tutorials/base/blog-in-five-minutes/">
tutorial
</a>
.
</p>
<p>
The hacker will join development at the{" "}
<a href="http://forge.extranet.logilab.fr/cubicweb/cubicweb">
forge
</a>
.
</p>
<p>
The impatient will move right away to{" "}
<a href="https://cubicweb.readthedocs.io/en/default/book/admin/setup">
Installation and set-up of a CubicWeb environment
</a>
.
</p>
</Exits>
<Footer id="footer">
<hr />
<p className="linksIcons">
Supported formats:
<a
href="http://www.w3.org/RDF/"
title="RDF Resource Description Framework"
>
<img
alt="RDF Resource Description Framework Icon"
src="//www.w3.org/RDF/icons/rdf_w3c_button.32"
height="15"
/>
</a>{" "}
<a
href="http://www.w3.org/2004/OWL/"
title="Web Ontology Language"
>
<img
alt="OWL Button"
src="//www.w3.org/Icons/SW/Buttons/sw-owl-blue"
width="80"
height="15"
/>
</a>{" "}
<a href="http://microformats.org">
<Image
unoptimized={true}
src={microformatsButton}
alt="microformats"
/>
</a>{" "}
<a href="http://www.json.org/">
<Image unoptimized={true} src={jsonButton} alt="JSON" />
</a>{" "}
<a href="http://www.rssboard.org">
<Image unoptimized={true} src={rssButton} alt="RSS" />
</a>
</p>
<p>
Supported vocabularies:
<a href="http://dublincore.org">
<Image
unoptimized={true}
src={dublincoreButton}
alt="dublincore"
/>
</a>{" "}
<a href="https://github.com/edumbill/doap/wiki">
<Image
unoptimized={true}
src={doapButton}
alt="DOAP"
height="15"
/>
</a>{" "}
<a href="http://sioc-project.org/">
<Image unoptimized={true} src={siocButton} alt="SIOC" />
</a>{" "}
<a href="http://www.foaf-project.org/">
<Image unoptimized={true} src={foafprojectButton} alt="FOAF" />
</a>
</p>
<p>
© Copyright 2008-{new Date().getFullYear()} by{" "}
<a className="logilab" href="https://www.logilab.fr/">
Logilab
</a>
.
</p>
</Footer>
</Content>
</Wrapper>
</>
);
};
const Wrapper = styled.div`
background-color: white;
width: 60em;
margin-left: auto;
margin-right: auto;
margin-top: 1em;
margin-bottom: 1em;
border-radius: 5px;
`;
const Title = styled.div`
padding: 0 3em;
display: inline-block;
width: 100%;
`;
const Logo = styled.div`
width: 46%;
height: 160px;
background-image: url(${logo});
background-repeat: no-repeat;
background-position: center right;
background-size: contain;
float: left;
`;
const Content = styled.div`
padding: 3em;
margin-top: 1em;
clear: both;
padding-top: 1em;
padding-bottom: 1em;
h1 {
margin-top: 0.8em;
margin-bottom: 0.2em;
font-size: 1.5em;
}
ul,
ol {
padding-left: 2em;
}
ul li {
margin-bottom: 5px;
}
p {
margin: 15px 0;
}
a {
color: #ff8000;
text-decoration: none;
&:hover {
text-decoration: underline;
}
img {
border: 0em;
}
}
`;
const NavList = styled.div`
ul {
display: flex;
padding: 0;
flex-direction: row;
margin: 0;
background-color: #ff8800;
background-image: linear-gradient(#ff9000, #ff7700);
li {
flex: 1;
display: table-cell;
margin: 0px;
text-align: center;
a {
padding: 10px 0;
display: block;
color: white;
text-decoration: none;
font-size: 0.9em;
border: 1px solid #fff;
border-width: 0 0 0 1px;
text-transform: uppercase;
line-height: 16px;
&:before {
font-size: 1.2em;
margin-right: 0.3em;
}
&:hover {
background-color: #ff9900;
}
}
&:first-child a {
border-width: 20;
}
}
}
`;
const Exits = styled.div`
margin: 0 1em;
padding: 1em;
border-radius: 10px;
border: 1px solid #e1e1e8;
background-color: #f7f7f9;
`;
const Footer = styled.div`
text-align: center;
padding: 2em 0;
font-size: 0.7em;
hr {
margin-bottom: 2em;
}
p {
margin: 8px 0;
}
.linksIcons {
display: flex;
gap: 20px;
justify-content: center;
align-items: center;
img {
vertical-align: middle;
}
a {
height: 15px;
}
}
`;
export default Home;
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:cc="http://creativecommons.org/ns#" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="260.68744" height="40.004143" id="svg4127" version="1.1" inkscape:version="0.48.3.1 r9886" sodipodi:docname="logo-cubicweb.svg">
<defs id="defs4129"/>
<sodipodi:namedview id="base" pagecolor="#ffffff" bordercolor="#666666" borderopacity="1.0" inkscape:pageopacity="0.0" inkscape:pageshadow="2" inkscape:zoom="5.6" inkscape:cx="65.025864" inkscape:cy="3.1272067" inkscape:document-units="px" inkscape:current-layer="layer1" showgrid="false" fit-margin-top="0" fit-margin-left="0" fit-margin-right="0" fit-margin-bottom="0" inkscape:window-width="1916" inkscape:window-height="1161" inkscape:window-x="1366" inkscape:window-y="18" inkscape:window-maximized="0" showguides="true" inkscape:guide-bbox="true">
<sodipodi:guide orientation="1,0" position="-144.19927,66.164991" id="guide3458"/>
</sodipodi:namedview>
<metadata id="metadata4132">
<rdf:RDF>
<cc:Work rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type rdf:resource="http://purl.org/dc/dcmitype/StillImage"/>
<dc:title/>
</cc:Work>
</rdf:RDF>
</metadata>
<g inkscape:label="Calque 1" inkscape:groupmode="layer" id="layer1" transform="translate(-326.79915,-550.62789)">
<g transform="matrix(1.0580599,0,0,1.0580599,1311.2897,209.92084)" id="g3151" style="font-size:32.60407639px;font-style:normal;font-weight:bold;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#2b0000;fill-opacity:1;stroke:none;font-family:orbitron;-inkscape-font-specification:orbitron">
<path inkscape:connector-curvature="0" id="path3153" style="fill:#404042;fill-opacity:1" d="m -792.00021,355.53459 14.70444,0 0,4.27114 -14.70444,0 c -1.23896,0 -2.30402,-0.43473 -3.1952,-1.30417 -0.86944,-0.89117 -1.30416,-1.95624 -1.30416,-3.1952 l 0,-9.91164 c 0,-1.23894 0.43472,-2.29313 1.30416,-3.16259 0.89118,-0.89116 1.95624,-1.33675 3.1952,-1.33677 l 14.63923,0 0,4.27113 -14.63923,0 c -0.15215,2e-5 -0.22823,0.0761 -0.22822,0.22823 l 0,9.91164 c -10e-6,0.15216 0.0761,0.22824 0.22822,0.22823"/>
<path inkscape:connector-curvature="0" style="fill:#404042;fill-opacity:1" id="path3155" d="m -833.03908,340.89536 4.27114,0 0,14.411 c -2e-5,1.23896 -0.44561,2.30403 -1.33677,3.1952 -0.86946,0.86944 -1.92366,1.30417 -3.1626,1.30417 l -10.20507,0 c -1.2607,0 -2.32576,-0.43473 -3.1952,-1.30417 -0.86945,-0.89117 -1.30417,-1.95624 -1.30416,-3.1952 l 0,-14.411 4.27113,0 0,14.411 c -10e-6,0.15216 0.0761,0.22824 0.22823,0.22823 l 10.20507,0 c 0.15214,1e-5 0.22822,-0.0761 0.22823,-0.22823 l 0,-14.411"/>
<path inkscape:connector-curvature="0" style="fill:#404042;fill-opacity:1" id="path3157" d="m -811.05372,340.89536 c 1.23894,2e-5 2.29313,0.44561 3.16259,1.33677 0.89116,0.86946 1.33675,1.92365 1.33677,3.16259 l 0,9.91164 c -2e-5,1.23896 -0.44561,2.30403 -1.33677,3.1952 -0.86946,0.86944 -1.92365,1.30417 -3.16259,1.30417 l -14.70444,0 0,-25.10514 4.27113,0 0,6.19477 10.43331,0 m 0.22823,14.411 0,-9.91164 c -2e-5,-0.15213 -0.0761,-0.22821 -0.22823,-0.22823 l -10.20508,0 c -0.15216,2e-5 -0.22823,0.0761 -0.22823,0.22823 l 0,9.91164 c 0,0.15216 0.0761,0.22824 0.22823,0.22823 l 10.20508,0 c 0.15213,1e-5 0.22821,-0.0761 0.22823,-0.22823"/>
<path inkscape:connector-curvature="0" id="path3159" style="fill:#404042;fill-opacity:1" d="m -804.04487,359.80573 0,-18.91037 4.27114,0 0,18.91037 -4.27114,0 m 0,-25.10514 4.27114,0 0,4.30373 -4.27114,0 0,-4.30373"/>
</g>
<path style="font-size:51.94805145px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#404042;fill-opacity:1;stroke:none;font-family:Orbitron;-inkscape-font-specification:Orbitron Bold" inkscape:connector-curvature="0" d="m 410.54179,557.96532 -32.16667,0 c -0.25926,10e-5 -0.38889,0.12972 -0.38888,0.38895 l 0,24.55552 c -1e-5,0.25923 0.12962,0.38885 0.38888,0.38885 l 32.16667,0 0,7.33339 -32.16667,0 c -2.14815,0 -3.98148,-0.7408 -5.49999,-2.2222 -1.48149,-1.51861 -2.22223,-3.35185 -2.22223,-5.50004 l 0,-24.55552 c 0,-2.14819 0.74074,-3.96293 2.22223,-5.44443 1.51851,-1.51851 3.35184,-2.27781 5.49999,-2.27781 l 32.16667,0 0,7.33329" id="path3161"/>
<path style="font-size:51.94805145px;font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;text-align:start;line-height:125%;letter-spacing:0px;word-spacing:0px;writing-mode:lr-tb;text-anchor:start;fill:#ff8800;fill-opacity:1;stroke:none;font-family:Orbitron;-inkscape-font-specification:Orbitron Bold" d="m 540.47435,550.62789 7.77778,0 -14.55555,40 -5.77778,0 -10.3889,-28.38894 -10.38888,28.38894 -5.72222,0 -14.55556,-40 7.77778,0 9.66667,26.38886 9.66666,-26.38886 7.16667,0 9.66667,26.38886 9.66666,-26.38886" id="path3163" inkscape:connector-curvature="0"/>
<g id="g3165" style="font-size:32.25769424px;font-style:normal;font-weight:bold;line-height:125%;letter-spacing:0px;word-spacing:0px;fill:#ff8800;fill-opacity:1;stroke:none;font-family:orbitron;-inkscape-font-specification:orbitron" transform="matrix(1.0694444,0,0,1.0694444,1320.9305,205.73013)">
<path inkscape:connector-curvature="0" id="path3167" style="fill:#ff8800;fill-opacity:1" d="m -712.66923,341.16755 c 1.22577,2e-5 2.26877,0.44087 3.12899,1.32257 0.88169,0.86022 1.32255,1.90322 1.32257,3.12899 l 0,7.03218 -14.77402,0 0,2.77416 c -1e-5,0.15054 0.0753,0.22581 0.2258,0.22581 l 14.54822,0 0,4.22575 -14.54822,0 c -1.2258,0 -2.27955,-0.4301 -3.16125,-1.2903 -0.86021,-0.88171 -1.29031,-1.93546 -1.29031,-3.16126 l 0,-9.80634 c 0,-1.22577 0.4301,-2.26877 1.29031,-3.12899 0.8817,-0.8817 1.93545,-1.32255 3.16125,-1.32257 l 10.09666,0 m -10.32246,7.22573 10.54826,0 0,-2.77417 c -10e-6,-0.15052 -0.0753,-0.22579 -0.2258,-0.2258 l -10.09666,0 c -0.15054,1e-5 -0.22581,0.0753 -0.2258,0.2258 l 0,2.77417"/>
<path inkscape:connector-curvature="0" id="path3169" style="fill:#ff8800;fill-opacity:1" d="m -690.26928,341.16755 c 1.22577,2e-5 2.26877,0.44087 3.12899,1.32257 0.88169,0.86022 1.32255,1.90322 1.32257,3.12899 l 0,9.80634 c -2e-5,1.2258 -0.44088,2.27955 -1.32257,3.16126 -0.86022,0.8602 -1.90322,1.2903 -3.12899,1.2903 l -14.54822,0 0,-24.83842 4.22576,0 0,6.12896 10.32246,0 m 0.2258,14.2579 0,-9.80634 c -10e-6,-0.15052 -0.0753,-0.22579 -0.2258,-0.2258 l -10.09666,0 c -0.15054,1e-5 -0.22581,0.0753 -0.2258,0.2258 l 0,9.80634 c -1e-5,0.15054 0.0753,0.22581 0.2258,0.22581 l 10.09666,0 c 0.15052,0 0.22579,-0.0753 0.2258,-0.22581"/>
</g>
<g transform="translate(155.71498,208.28104)" id="g3408">
<path sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" id="path3410" d="m 196.89624,349.49384 -8.06851,4.8684 0,10.62195 8.06851,-4.8684 z" style="fill:#ff8800;fill-opacity:1;stroke:none"/>
<path sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" style="fill:#ff8800;fill-opacity:1;stroke:none" d="m 188.28608,343.70506 8.00049,4.84516 -8.00049,4.78822 -8.00051,-4.78822 z" id="path3412"/>
<path style="fill:#ff8800;fill-opacity:1;stroke:none" d="m 187.69852,366.86825 -8.06851,4.8684 0,10.62195 8.06851,-4.8684 z" id="path3414" inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc"/>
<path id="path3416" d="m 179.08836,361.07947 8.00049,4.84516 -8.00049,4.78822 -8.00051,-4.78822 z" style="fill:#ff8800;fill-opacity:1;stroke:none" inkscape:connector-curvature="0" sodipodi:nodetypes="ccccc"/>
<path sodipodi:nodetypes="ccccc" inkscape:connector-curvature="0" id="path3418" d="m 206.05702,366.86825 -8.06851,4.8684 0,10.62195 8.06851,-4.8684 z" style="fill:#ff8800;fill-opacity:1;stroke:none"/>
<path sodipodi:nodetypes="cccccc" inkscape:connector-curvature="0" id="path3420" d="m 197.41294,361.10753 -8.00027,4.84524 8.00686,4.78602 c 0.0406,-0.0455 6.64235,-2.44836 7.44329,-10.21298 -2.81627,1.46 -3.71023,2.32033 -7.44988,0.58175 z" style="fill:#404042;fill-opacity:1;stroke:none"/>
</g>
</g>
</svg>
\ No newline at end of file
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment