diff --git a/.idea/.gitignore b/.idea/.gitignore new file mode 100644 index 0000000..b58b603 --- /dev/null +++ b/.idea/.gitignore @@ -0,0 +1,5 @@ +# Default ignored files +/shelf/ +/workspace.xml +# Editor-based HTTP Client requests +/httpRequests/ diff --git a/.idea/ArthurDanjouFR - Client.iml b/.idea/ArthurDanjouFR - Client.iml new file mode 100644 index 0000000..24643cc --- /dev/null +++ b/.idea/ArthurDanjouFR - Client.iml @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/.idea/discord.xml b/.idea/discord.xml new file mode 100644 index 0000000..1857a48 --- /dev/null +++ b/.idea/discord.xml @@ -0,0 +1,9 @@ + + + + + + + \ No newline at end of file diff --git a/.idea/misc.xml b/.idea/misc.xml new file mode 100644 index 0000000..24eb271 --- /dev/null +++ b/.idea/misc.xml @@ -0,0 +1,6 @@ + + + + + \ No newline at end of file diff --git a/.idea/modules.xml b/.idea/modules.xml new file mode 100644 index 0000000..f11d950 --- /dev/null +++ b/.idea/modules.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/.idea/vcs.xml b/.idea/vcs.xml new file mode 100644 index 0000000..94a25f7 --- /dev/null +++ b/.idea/vcs.xml @@ -0,0 +1,6 @@ + + + + + + \ No newline at end of file diff --git a/.idea/watcherTasks.xml b/.idea/watcherTasks.xml new file mode 100644 index 0000000..fb0d65a --- /dev/null +++ b/.idea/watcherTasks.xml @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/README.md b/README.md index 42f8df3..d7a30f0 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,3 @@ -# TODO List - #### **Pages :** - Accueil @@ -11,63 +9,6 @@ - Showcase a faire quand le site est en ligne - Service (Dev, conseil) ---- -###Accueil - -- Banniere Dev x Etudiant -- Présentation + lien vers /about -- Review des 3 derniers articles (1 grand, 2 petits) + lire les autres - ---- -### About - -- Mon histoire -- Mes passions -- Mes compétences + Lien CV - ---- -### Blog - -- Page accueil -- Route dynamique -- Template d'article (cf shema) -- Recherche d'article -- Ajouter un clap (stocker BDD + cookie) -- Fleche de partage (copier le lien | partage twitter / facebook / snapchat / instagram) -- Sidebar de lecture -- Déroulement sur la droite -- Stocker les articles mongo -- Rédiger - -- Recet / Pinned -- Tag / Clap / Most Read - ---- -### Environnement - -- Mon setup -- Applications - ---- -### Contact - -- mailto:contact@arthurdanjou.fr - ---- -### Header -- Logo (Gauche) + Menu (Droite) -- animation lors du click -- effet tres beau -- Lien vers les pages + GitHub / Twitter - ---- -### Footer - -- Lien vers les pages -- Réseaux sociaux -- Copyright - ---- ### Autres - Effet style avec l'hover - Day/Night \ No newline at end of file diff --git a/components/Home/about/about.js b/components/Home/about/about.js deleted file mode 100644 index 5fc2368..0000000 --- a/components/Home/about/about.js +++ /dev/null @@ -1,36 +0,0 @@ -import React from "react"; -import "./about.scss"; -import Tag from "../tag/tag"; -import Link from "next/link"; - -const About = () => { - return ( -
- Qui suis-je ? -
-
- My photo -
-
-
-

C'est moi !

-

- Je m'appelle Arthur DANJOU. J'ai 17 ans, je suis né au Luxembourg et j'habite actuellement à Paris.
- Depuis tout jeune, je suis passionné d'informatique. C'est en 2015 que j'ai commencé à développer.
- C'est en pratiquant chaque jour que je me forme et que j'acquiers de nouvelles compétences au travers de mes différents projets personnels et professionnels. -

-
- -
- - En savoir plus - -
- -
-
-
- ) -}; - -export default About; \ No newline at end of file diff --git a/components/Home/about/about.scss b/components/Home/about/about.scss deleted file mode 100644 index a108626..0000000 --- a/components/Home/about/about.scss +++ /dev/null @@ -1,123 +0,0 @@ -#about { - background-color: #1c1c1c; - height: 80vh; - width: 100%; - - @media screen and (max-width: 700px) { - height: 100vh; - } - - .about-content { - padding: 40px; - width: 100%; - height: 80vh; - display: flex; - justify-content: center; - align-content: center; - position: absolute; - flex-direction: row-reverse; - - @media screen and (max-width: 700px) { - flex-direction: column; - height: 100vh; - } - - .about-left { - height: 100%; - width: 50%; - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - - @media screen and (max-width: 700px) { - width: 100%; - } - - .left-content { - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - - h1 { - font-size: 3rem; - color: white; - margin-left: 30px; - margin-bottom: 30px; - - @media screen and (max-width: 700px) { - margin-bottom: 30px; - margin-left: 0; - text-align: center; - } - - } - p { - text-align: justify; - color: rgba(255, 255, 255, 0.3); - font-size: 1.3rem; - - .color { - color: #fa7878; - } - } - } - - .page-button { - margin-top: 40px; - width: 50%; - background-color: #4d4d4d; - color: white; - border-radius: 7px; - padding: 20px 15px; - transition: .3s; - text-align: center; - font-size: 1.2rem; - display: flex; - justify-content: center; - align-self: center; - - @media screen and (max-width: 700px) { - width: 60%; - } - - &:hover { - cursor: pointer; - background-color: #313030; - } - } - } - - .about-right { - height: 100%; - width: 50%; - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - - img { - margin: 0 auto; - width: 50%; - animation: infinite linear imgAnimation 10s; - - @media screen and (max-width: 700px) { - width: 70%; - } - } - } - } -} - -@keyframes imgAnimation { - 0% { - transform: translateY(0); - } - 50% { - transform: translateY(-20px); - } - 100% { - transform: translateY(0); - } -} \ No newline at end of file diff --git a/components/Home/posts/loading/Loading.js b/components/Home/posts/loading/Loading.js deleted file mode 100644 index 0ada662..0000000 --- a/components/Home/posts/loading/Loading.js +++ /dev/null @@ -1,28 +0,0 @@ -import React from "react"; -import "./loading.scss"; - -const Loading = (props) => { - return ( -
- - - -
- ) -}; - -export default Loading; \ No newline at end of file diff --git a/components/Home/posts/loading/loading.scss b/components/Home/posts/loading/loading.scss deleted file mode 100644 index bc48378..0000000 --- a/components/Home/posts/loading/loading.scss +++ /dev/null @@ -1,38 +0,0 @@ -// loading -$offset: 374; -$duration: 1.4s; - -.spinner { - animation: rotator $duration linear infinite; -} - -@keyframes rotator { - 0% { - transform: rotate(0deg); - } - 100% { - transform: rotate(270deg); - } -} - -.path { - stroke-dasharray: $offset; - stroke-dashoffset: 0; - transform-origin: center; - animation: dash $duration ease-in-out infinite; - stroke: black; -} - -@keyframes dash { - 0% { - stroke-dashoffset: $offset; - } - 50% { - stroke-dashoffset: $offset/4; - transform: rotate(135deg); - } - 100% { - stroke-dashoffset: $offset; - transform: rotate(450deg); - } -} \ No newline at end of file diff --git a/components/Home/posts/posts.js b/components/Home/posts/posts.js deleted file mode 100644 index 137d4d2..0000000 --- a/components/Home/posts/posts.js +++ /dev/null @@ -1,69 +0,0 @@ -import React, {useEffect, useState} from "react"; -import "./posts.scss"; -import Tag from "../tag/tag"; -import * as axios from "axios"; -import Loading from "./loading/Loading"; -import Link from "next/link"; -import 'moment/locale/fr'; -import Moment, { now } from 'react-moment'; - -const Posts = () => { - - const [isLoading, setLoading] = useState(true); - const [getPosts, setPosts] = useState([]); - - useEffect(() => { - loadPosts() - .then(() => { - setLoading(false); - }) - .catch(error => console.log(error)); - }, []); - - const loadPosts = async () => { - await axios.get("https://localhost:8080/api/posts") - .then(response => { - setPosts(response); - }) - .catch(error => console.log(error)); - } - - const renderPosts = () => { - if (getPosts.length) { - return ( -
- {getPosts.map(post => { - return ( -
- - -
-

{post.title}

- - -
- {now} -
-
- ) - })} -
- ) - } else { - return ( -
-

Il n'y a malheureusement aucun article de posté pour le moment. 😕

-
- ) - } - }; - - return ( -
- Mon blog - {isLoading ? : renderPosts()} -
- ) -}; - -export default Posts; \ No newline at end of file diff --git a/components/Home/posts/posts.scss b/components/Home/posts/posts.scss deleted file mode 100644 index 0516975..0000000 --- a/components/Home/posts/posts.scss +++ /dev/null @@ -1,21 +0,0 @@ -#posts { - height: 70vh; - width: 100%; - background-color: white; - color: #37383F; - - @media screen and (max-width: 700px) { - text-align: center; - font-size: 15px; - } - - .container { - width: 100%; - height: 70vh; - display: flex; - justify-content: center; - align-items: center; - position: absolute; - } - -} \ No newline at end of file diff --git a/components/Home/process/process.scss b/components/Home/process/process.scss deleted file mode 100644 index b59e4ff..0000000 --- a/components/Home/process/process.scss +++ /dev/null @@ -1,94 +0,0 @@ -#process { - height: 90vh; - width: 100%; - background-color: #1c1c1c; - color: rgba(255, 255, 255, 0.3); - - @media screen and (max-width: 700px) { - height: 130vh; - } - - .process-container { - width: 100%; - height: 90vh; - display: flex; - justify-content: center; - align-items: center; - position: absolute; - flex-direction: row; - - @media screen and (max-width: 700px) { - height: 130vh; - padding: 10px; - flex-direction: column; - text-align: center; - } - - .process-left { - width: 50%; - height: 100%; - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - - @media screen and (max-width: 700px) { - width: 100%; - height: 130vh; - } - - .processus { - width: 80%; - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - padding-bottom: 30px; - - .color { - color: #fcd9ff; - } - - h1 { - color: white; - font-size: 1.5rem; - align-self: center; - - &:after { - margin: 7px auto; - width: 40px; - height: 2px; - display: block; - content: ""; - background-color: #ff00f2; - } - } - - p { - align-self: center; - text-align: justify; - font-size: 1.2rem; - } - } - } - - .process-right { - width: 50%; - height: 100%; - display: flex; - flex-direction: column; - justify-content: center; - align-self: center; - - @media screen and (max-width: 700px) { - display: none; - } - - img { - margin: 0 auto; - width: 65%; - } - } - - } -} \ No newline at end of file diff --git a/components/Home/skills/skills.js b/components/Home/skills/skills.js deleted file mode 100644 index 535ad66..0000000 --- a/components/Home/skills/skills.js +++ /dev/null @@ -1,29 +0,0 @@ -import React from "react"; -import "./skills.scss"; -import Tag from "../tag/tag"; - -const Skills = () => { - return ( -
- Ce que j'aime -
-
-

Le Développement

-

- Je suis développeur Web FullStack, c'est à dire que je maîtrise le BackEnd et le FrontEnd. - Je réalise des sites pour des projets personnels ou professionnels. En parallèle, je développe des logiciels Mobile et Desktop. -

-
-
-

La Technologie

-

- J'adore la sécurité, le DevOps, et les machines. - Ce sont des domaines très importants qu'il ne faut pas négliger sur un projet ! Je me documente au quotidien pour respecter la vie privée de mes clients. -

-
-
-
- ) -}; - -export default Skills; \ No newline at end of file diff --git a/components/Home/skills/skills.scss b/components/Home/skills/skills.scss deleted file mode 100644 index 1ef4b32..0000000 --- a/components/Home/skills/skills.scss +++ /dev/null @@ -1,68 +0,0 @@ -$text-color: #37383F; - -#skills { - height: 60vh; - width: 100%; - background-color: white; - color:$text-color; - - @media screen and (max-width: 700px) { - height: 90vh; - } - - .skills-container { - padding: 40px; - width: 100%; - height: 60vh; - display: flex; - justify-content: center; - align-content: center; - position: absolute; - flex-direction: row; - - @media screen and (max-width: 700px) { - height: 90vh; - padding: 10px; - flex-direction: column; - text-align: center; - } - - .skill { - width: 50%; - height: 100%; - display: flex; - flex-direction: column; - justify-content: center; - padding: 10%; - - @media screen and (max-width: 700px) { - width: 100%; - height: 40%; - } - - .color { - color: #d9fcff; - } - - h1 { - text-align: center; - font-size: 1.7rem; - margin-bottom: 20px; - - &:after { - margin: 7px auto; - width: 40px; - height: 2px; - display: block; - content: ""; - background-color: #00d9ff; - } - } - p { - font-size: 1.2rem; - text-align: justify; - } - } - } - -} \ No newline at end of file diff --git a/components/Home/tag/tag.js b/components/Home/tag/tag.js deleted file mode 100644 index ef0c8a6..0000000 --- a/components/Home/tag/tag.js +++ /dev/null @@ -1,18 +0,0 @@ -import React from "react"; -import "./tag.scss"; - -const Tag = (props) => { - return ( -
-

{props.children}

- -
- ) -}; - -export default Tag; \ No newline at end of file diff --git a/components/about/about.js b/components/about/about.js new file mode 100644 index 0000000..1f2e2bc --- /dev/null +++ b/components/about/about.js @@ -0,0 +1,110 @@ +import React from "react"; +import {BddMap, FrameWorksMap, LanguagesMap, OtherMap} from "./skill"; +import Link from "next/link"; + +const About = () => { + return ( +
+ Photo de moi +
+

Introduction 👋

+

+ Salut, je suis Arthur Danjou ! +
+ Je suis agé de 17 ans. Je suis né au Luxembourg, j'ai vécu en Belgique et actuellement je vis en France. + Je suis passionné par l'informatique, les nouvelles technologies et la moto? Je développe des applications web, mobiles et bureautiques. +

+
+
+

Mon parcours 🧮

+

+ Comme dit précédemment, en 2015 j'ai commencé à développer en Java pour créer des plugins sur MineCraft. + J'ai rejoins différents projets qui m'ont appris différentes technologies et m'ont aidés à améliorer mon niveau en Java. + Puis j'ai voulu m'expertiser dans le Web, oui ce vaste domaine. J'ai donc appris de nouveaux langages. Avec ces mêmes langages, + on peut développer des applications mobiles et bureautiques. En parallèle, j'ai passé mon permis moto, le permis A1. Depuis ce moment, une nouvelle passion s'est créee en moi. + Avec mes cours, j'ai pu passer la formation PSC1 (Prévention et secours civiques de niveau 1). + +

+
+
+

Ma formation 📚

+

+ Je suis actuellement en classe de première générale. Je fais partie de la génération du nouveau baccalauréat. + Mes spécialités sont Mathémétiques, Physique-Chimie et Sciences économiques et sociales. + Pour la classe de Terminale, je garde les deux premières spécialités listées précédemment. + J'envisage de faire une classe préparatoire MP2I (Maths / Physique / Informatique / Ingénieurie). + C'est une nouvelle classe préparatoire. Enfin, j'aimerais rejoindre une école d'ingénieur spécialisée en informatique, ou dans un autre domaine. +

+
+
+

Mes compétences 🎨

+

+ En développant régulièrement, j'améliore mes compétences et je découvre de nouvelles technologies augmentant donc ma stack. + réalise beaucoup de projets professionnels et personnels pour découvrir et approfondir mes connaissances. + Ma stack actuelle se compose de : +

+
+

Langages de programmation

+ +
+
+

Bases de données

+ +
+
+

Frameworks

+ +
+
+

Autres

+ +
+
+
+

Mes expériences 🧰

+

+ Durant ma scolarité, j'ai eu la chance de découvrir pleins de métiers en stage. +

+
    +
  • +

    Erisium

    +
    Février 2019 - Aujourd'hui
    +

    + Développement et réalisation de projets Back-End et Front-End réalisés par l’équipe GamePlay – Maintien et mise à jour des projets en production. +

    +
    • +
  • +

    Idemia

    +
    Juin 2019
    +

    + Découverte du secteur IT, technologie de l’information – Découverte du data-center – Découverte de différents métiers de la société + (développeur, support informatique, UX/UI designer, chef de produits...) +

    +
    • +
  • +

    La Salle à Manger

    +
    Avril 2018
    +

    + Nettoyage de la salle – Serveur – Prise de commandes – Accueil des clients +

    +
    • +
+
+ + + Mon CV + + +
+ ) +}; + +export default About; + +//TODO CV +/* +Présentation +Compétences +Parcours (Education) + + */ \ No newline at end of file diff --git a/components/about/skill.js b/components/about/skill.js new file mode 100644 index 0000000..ad61ad7 --- /dev/null +++ b/components/about/skill.js @@ -0,0 +1,78 @@ +import React from "react"; + +const languages = [ + "Java", + "Python", + "JavaScript", + "TypeScript", + "HTML/CSS", + "NodeJS", + "Markdown", +]; + +const bdds = [ + "MariaDB", + "Redis", + "RabbitMQ", + //"PostgreSQL", + "MongoDB" +]; + +const frameworks = [ + "Spring", + "ElectronJS", + "ReactJS", + "NextJS", + "React Native", + "AdonisJS v5", +]; + +const others = [ + "DevSecOps", + "Git", + "Team", + "RestAPI", + "SysAdmin", + //"Docker", + //"Kubernetes", +]; + +export const LanguagesMap = () => { + return ( + + ) +} + +export const BddMap = () => { + return ( + + ) +} + +export const FrameWorksMap = () => { + return ( + + ) +} + +export const OtherMap = () => { + return ( + + ) +} \ No newline at end of file diff --git a/components/environnement/env.js b/components/environnement/env.js new file mode 100644 index 0000000..65aab8c --- /dev/null +++ b/components/environnement/env.js @@ -0,0 +1,82 @@ +import React from "react"; + +const Env = () => { + return ( +
+
+

Mon matériel 💼

+

Ce setup m'accompagne tous les jours pour développer. Je souhaite m'acheter un ordinateur portable pour être plus mobile.

+
    +
  • + 💻 Ordinateur Fixe Asus (i5, 8Go Ram, GTX 950, 1To HDD) +
    • +
  • + ⌨ Clavier Microsoft & Souris Roccat Kova +
    • +
  • + 🎧 Airpods +
    • +
  • + 🎧 Turtle Beach PX22 +
    • +
  • + 📱 Samsung Note 8 +
    • +
+
+
+

Mes éditeurs de texte 🧰

+

Je dispose de la license étudiante Jetbrains pour avori accès gratuitement

+ +
+
+

Mes applications 📌

+

J'utilise ces applications pour gagner du temps. Elles sont disponible également sur mon téléphone pour être toujours connecté.

+
    +
  • + Chrome Developer pour aller sur Internet. +
    • +
  • + Affinity Designer pour réaliser mes maquettes et mes designs. +
    • +
  • + Evernote pour prendre des notes et rédiger. +
    • +
  • + Trello pour organiser mes projets. +
    • +
  • + Github pour poster les sources de mes projets. +
    • +
  • + Discord, Slack et Mattermost pour communiquer +
    • +
  • + Les documentations me permettent d'apprendre plus sur les frameworks que j'utilise. +
    • +
+
+
+ ) +}; + +export default Env; \ No newline at end of file diff --git a/components/footer/footer.js b/components/footer/footer.js index b4ff688..f4b9abb 100644 --- a/components/footer/footer.js +++ b/components/footer/footer.js @@ -1,5 +1,4 @@ import React from 'react'; -import "./footer.scss"; const Footer = () => { return ( @@ -11,8 +10,8 @@ const Footer = () => {
à contact@arthurdanjou.fr pour que l'on en discute ensemble ! -
-
+
ou
+

Retrouvez moi sur

GitHub Icon @@ -20,11 +19,15 @@ const Footer = () => { Twitter Icon - - Mail Icon -
+
+

+ Développé et conçu avec ❤ par Arthur Danjou +
+ © Copyright 2020 - Tous droits réservés +

+
) } diff --git a/components/footer/footer.scss b/components/footer/footer.scss deleted file mode 100644 index 9bd089d..0000000 --- a/components/footer/footer.scss +++ /dev/null @@ -1,65 +0,0 @@ -#footer { - color: white; - height: 450px; - - .footer-top { - height: 80%; - background-color: #1c1c1c; - text-align: center; - display: flex; - flex-direction: column; - justify-content: center; - align-content: center; - margin: 0 auto; - - h1 { - margin-bottom: 20px; - font-weight: 900; - font-size: 50px; - - @media screen and (max-width: 700px) { - font-size: 30px; - } - } - - h3 { - color: #a0a0a0; - span { - text-decoration: underline; - &:hover { - color: white; - } - } - - @media screen and (max-width: 700px) { - padding: 0 10px; - text-align: center; - } - } - } - - .footer-bottom { - height: 20%; - background-color: #111111; - display: flex; - justify-content: center; - align-items: center; - - .social-list { - display: flex; - justify-content: space-evenly; - width: 30%; - - @media screen and (max-width: 700px) { - width: 60%; - } - } - img { - height: 40px; - transition: .2s; - &:hover { - transform: scale(1.1); - } - } - } -} \ No newline at end of file diff --git a/components/header/activelink/activelink.js b/components/header/activelink.js similarity index 100% rename from components/header/activelink/activelink.js rename to components/header/activelink.js diff --git a/components/header/header.js b/components/header/header.js index 6da325a..34cb090 100644 --- a/components/header/header.js +++ b/components/header/header.js @@ -1,68 +1,52 @@ import React, {useState} from 'react'; +import ActiveLink from "./activelink"; import Link from "next/link"; -import "./header.scss"; -import ActiveLink from "./activelink/activelink"; const Header = () => { const [isOpened, setOpened] = useState(false); - const [isActive, setActive] = useState(false); return (