From 04f22552927a635bf091fdeb1985586d05c13640 Mon Sep 17 00:00:00 2001 From: valero-g Date: Tue, 8 Apr 2025 19:06:38 +0000 Subject: [PATCH] Valero first commit --- .vscode/settings.json | 3 +++ index.html | 2 +- package-lock.json | 3 +++ src/js/components/Home.jsx | 27 +++++++++++---------------- src/js/components/Jumbotron.jsx | 14 ++++++++++++++ src/js/components/Navbar.jsx | 24 ++++++++++++++++++++++++ 6 files changed, 56 insertions(+), 17 deletions(-) create mode 100644 src/js/components/Jumbotron.jsx create mode 100644 src/js/components/Navbar.jsx diff --git a/.vscode/settings.json b/.vscode/settings.json index d83b5ba6c..b4cb7ea09 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -3,5 +3,8 @@ "editor.defaultFormatter": "esbenp.prettier-vscode", "workbench.editorAssociations": { "*.md": "vscode.markdown.preview.editor" + }, + "[javascriptreact]": { + "editor.defaultFormatter": "vscode.typescript-language-features" } } \ No newline at end of file diff --git a/index.html b/index.html index 62cb9bc4f..d7eb8e88a 100644 --- a/index.html +++ b/index.html @@ -4,7 +4,7 @@ - Hello Rigo with Vanilla.js + Landing page with React- Johanna / Valero
diff --git a/package-lock.json b/package-lock.json index d6b5fd56a..a87d148a9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -21,6 +21,9 @@ "eslint-plugin-react-hooks": "^4.6.0", "eslint-plugin-react-refresh": "^0.4.6", "vite": "^5.2.0" + }, + "engines": { + "node": ">=20.0.0" } }, "node_modules/@eslint-community/eslint-utils": { diff --git a/src/js/components/Home.jsx b/src/js/components/Home.jsx index 74bc8d768..c84d8ddd5 100644 --- a/src/js/components/Home.jsx +++ b/src/js/components/Home.jsx @@ -1,26 +1,21 @@ import React from "react"; +import Navbar from "./Navbar.jsx"; +import Jumbotron from "./Jumbotron.jsx" + //include images into your bundle -import rigoImage from "../../img/rigo-baby.jpg"; + //create your first component const Home = () => { return ( -
- - -

Hello Rigo!

-

- -

- - If you see this green button... bootstrap is working... - -

- Made by{" "} - 4Geeks Academy, with - love! -

+
+
+ +
+
+ +
); }; diff --git a/src/js/components/Jumbotron.jsx b/src/js/components/Jumbotron.jsx new file mode 100644 index 000000000..d742a99f4 --- /dev/null +++ b/src/js/components/Jumbotron.jsx @@ -0,0 +1,14 @@ +import React from "react"; + +const Jumbotron = () => { + return( +
+

A Warm Welcome

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Quos deleniti doloremque, ipsam voluptatum perspiciatis assumenda debitis consectetur doloribus, ut hic non nisi totam, ipsa alias. Quis explicabo similique eligendi repellendus.

+ +
+ ) +} + + +export default Jumbotron; \ No newline at end of file diff --git a/src/js/components/Navbar.jsx b/src/js/components/Navbar.jsx new file mode 100644 index 000000000..f29e2a346 --- /dev/null +++ b/src/js/components/Navbar.jsx @@ -0,0 +1,24 @@ +import React from "react"; + +const Navbar = () => { + return ( + + ); +}; + +export default Navbar; \ No newline at end of file