@ -1,6 +1,8 @@
import Head from 'next/head' import Head from 'next/head'
import Image from 'next/image' import Image from 'next/image'
import styles from '../styles/Index.module.css' import styles from '../styles/Index.module.css'
import Buttons from '../components/buttons'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
import { faTractor } from '@fortawesome/free-solid-svg-icons' import { faTractor } from '@fortawesome/free-solid-svg-icons'
import { faBatteryFull } from '@fortawesome/free-solid-svg-icons' import { faBatteryFull } from '@fortawesome/free-solid-svg-icons'
@ -8,10 +10,14 @@ import { faHandshake } from '@fortawesome/free-solid-svg-icons'
import { faMoneyBillWave } from '@fortawesome/free-solid-svg-icons' import { faMoneyBillWave } from '@fortawesome/free-solid-svg-icons'
import { faForward } from '@fortawesome/free-solid-svg-icons' import { faForward } from '@fortawesome/free-solid-svg-icons'
import { faStream } from '@fortawesome/free-solid-svg-icons' import { faStream } from '@fortawesome/free-solid-svg-icons'
import { faQuoteLeft } from '@fortawesome/free-solid-svg-icons'
import { faQuoteRight } from '@fortawesome/free-solid-svg-icons'
import logo from '../public/img/logoblue.png'
export default function Home() { export default function Home() {
return (
return (
< div className = "page" >
< div className = { "page " + styles . index } >
< Head >
< Head >
< title > { process . env . NEXT_PUBLIC_NAME } < / title >
< title > { process . env . NEXT_PUBLIC_NAME } < / title >
< meta name = "viewport" content = "initial-scale=1.0, width=device-width" / >
< meta name = "viewport" content = "initial-scale=1.0, width=device-width" / >
@ -24,65 +30,124 @@ export default function Home() {
< article className = { "content " + styles . indexanim } >
< article className = { "content " + styles . indexanim } >
< h1 className = { styles . description } >
< h1 className = { styles . description } >
DubbelNull is a small 2 - man startup from The Netherlands developing and designing web applications .
{ "DubbelNull is a small IT development team from The Netherlands making and designing web applications. " }
We make all kinds of things with a range of technologies like Laravel , NextJS and Wordpress .
{ "We build with a variety of tools such as Laravel, NextJS, NestJS and Wordpress." }
< / h1 >
< / h1 >
< hr / >
< hr / >
< div className = { styles . features } >
< section className = { styles . features } >
< div >
< div className = { styles . block } >
< section >
< FontAwesomeIcon fixedWidth icon = { faTractor } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faTractor } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Crystal clear sense < / h3 >
< h3 > Crystal clear sense < / h3 >
< p > Farm based hosting < / p >
< p >
{ "We understand the struggle of long meetings only to still have misunderstandings. " }
{ "We are straight to the point and will inform you of your options upfront." }
< / p >
< / div >
< / div >
< / div >
< / section >
< section >
< div className = { styles . block } >
< FontAwesomeIcon fixedWidth icon = { faHandshake } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faHandshake } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Service focused < / h3 >
< h3 > Service focused < / h3 >
< p > { "Need something we don't explicitly offer? We can always work something out." } < / p >
< p >
{ "We can always work something out, even if what you need is not technically in our range of offerings. " }
{ "Our mission is to help make you succeed and own the IT space, no matter what that might be." }
< / p >
< / div >
< / div >
< / div >
< / section >
< section >
< div className = { styles . block } >
< FontAwesomeIcon fixedWidth icon = { faForward } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faForward } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Future proof < / h3 >
< h3 > Future proof < / h3 >
< p > Yes < / p >
< p >
{ "We work with the newest technologies and use agnostic systems to ensure they will keep working even if an individual piece gets outdated." }
< / p >
< / div >
< / div >
< / section >
< / div >
< / div >
< div >
< div className = { styles . block } >
< section >
< FontAwesomeIcon fixedWidth icon = { faBatteryFull } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faBatteryFull } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Involved and committed < / h3 >
< h3 > Involved and committed < / h3 >
< p > Yes < / p >
< p >
{ "Our job resulted from our hobby as IT enthusiasts. Our enjoyment is to see your product succeed, so everything we do is geared towards that goal. " }
< / p >
< / div >
< / div >
< / div >
< / section >
< section >
< div className = { styles . block } >
< FontAwesomeIcon fixedWidth icon = { faMoneyBillWave } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faMoneyBillWave } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Price minded < / h3 >
< h3 > Price minded < / h3 >
< p > { "Take advantage of the small scale of a startup's cost advantage" } < / p >
< p >
{ "We are a small startup with very little background costs. " }
{ "Those cost savings are directly forwarded to you, the client." }
< / p >
< / div >
< / div >
< / div >
< / section >
< section >
< div className = { styles . block } >
< FontAwesomeIcon fixedWidth icon = { faStream } size = "2x" style = { { color : "var(--theme-color)" } } / >
< FontAwesomeIcon fixedWidth icon = { faStream } size = "2x" style = { { color : "var(--theme-color)" } } / >
< div >
< div >
< h3 > Flexible and versatile < / h3 >
< h3 > Flexible and versatile < / h3 >
< p > Yes < / p >
< p >
{ "We work with a large range of technologies so we can fit your needs. " }
{ "We're not afraid to try out new things if the situation calls for it either." }
< / p >
< / div >
< / div >
< / div >
< / section >
< / section >
< hr / >
< section >
< h2 > See what our customers say < / h2 >
< br / >
< div className = { styles . quote } >
< div >
< FontAwesomeIcon icon = { faQuoteRight } size = "6x" style = { { color : "var(--theme-color)" } } / >
< / div >
< div >
< p >
< FontAwesomeIcon icon = { faQuoteLeft } size = "1x" style = { { color : "gray" } } / >
{ " The site is amazing, the work that went into this is incredible. " }
{ " The look and small details make it so amazing. " }
{ " I highly recommend getting yourself a sight made by DubbelNull, their talent is outstanding and the customer service was amazing. " }
{ " They were always there to answer any questions I had and was happy to change the things I wanted. " }
< FontAwesomeIcon icon = { faQuoteRight } size = "1x" style = { { color : "gray" } } / >
< / p >
< i > — Trick @ < a href = "https://trickthefox.com" target = "_blank" > trickthefox . com < / a > < / i >
< / div >
< / div >
< br / >
{ / * < d i v c l a s s N a m e = { s t y l e s . q u o t e } >
< div >
< p >
< FontAwesomeIcon icon = { faQuoteLeft } size = "1x" style = { { color : "gray" } } / >
{ " Wheter it is PHP Laravel, NodeJS Nextjs or even Wordpress, we can do it. Wheter it is PHP Laravel, NodeJS Nextjs or even Wordpress, we can do it. Wheter it is PHP Laravel, NodeJS Nextjs or even Wordpress, we can do it. " }
< FontAwesomeIcon icon = { faQuoteRight } size = "1x" style = { { color : "gray" } } / >
< / p >
< i > — Merete & Melvyn @ < a href = "https://lifecentrelivingston.com" target = "_blank" > lifecentrelivingston . com < / a > < / i >
< / div >
< / div >
< div >
< FontAwesomeIcon icon = { faQuoteRight } size = "6x" style = { { color : "var(--theme-color)" } } / >
< / div >
< / div >
< / div > * / }
< / section >
< hr / >
< section >
< Buttons / >
< / section >
< / article >
< / article >
< / section >
< / section >
< / div >
< / div >
