Wesley Dzitzer Portfolio Website (ReactJS build)

Bootstrapped with Create React App. Implements Tailwind CSS, PostCSS, react-spring, react-router-dom, EmailJS, Google reCaptcha v2, and Font Awesome.

Information

  • Note: This website is currently WIP and has not reached Minimal Viable Product (MVP) state yet; the files listed below are not up to date.

Important Instructions

  • When installing for the first time, run npm install.
  • For Tailwind CSS dependency, make sure to run npm run build:css if you do not see tailwind.css. Tailwind.css file is ignored. This command will automatically run everytime you use npm start.
  • npm update runs automatically everytime you use npm start.
  • npm build runs what npm start command will run, but will write to the build folder. For now, do not run this command as this repo is designed to be cloned in the future.
  • Check React documentation if needed for more information Here.

Purpose of Repo

This repo is my boilerplate template for future front-end website designs. It is a work in progress and will be updated as I build. This readme will be updated as I add more to this boilerplate template design.

Content of repo

node_modules folder:

  • Contains all node package dependencies, is ignored in this repo.

public folder:

  1. index.html: Index page of the entire app. Do not edit anything on this html page except the title tags.
  2. manifest.json: Json that holds visual information. Do not edit on this repo.
  3. robots.txt: Do not edit on this repo.

src folder:

  1. components folder:
  • Footer.js: The footer web component of boilerplate web design.
  • Header.js: The header web component of boilerplate web design.
  • HeaderText.js: Text that appears under the Header web component.
  • Navigation.js: Base navigation web component.
  • NavigationMenu.js: Web component that takes each individual link and displays to the main Mavigation web component.
  1. webPages folder: Note: each js file is their own displayed web page within the app.
  • About.js: Sample about web page.
  • Home.js: Sample home web page.
  1. Other files in src:
  • App.js: The root JS file in entire app, all web components reference to this JS file; however, it is not the main JS file.
  • App.test.js: Tests the App.
  • index.css: Main CSS file, tailwind CSS is referenced here.
  • index.js: Main JS file.
  • serviceWorker.js: Part of create-react-app, do not edit.
  • setupTests.js: Part of create-react-app, do not edit.
  • tailwind.css: Generated using tailwind.css, ignored in this repo, is generated automatically upon start or build. Do not edit.

Other files:

  • package.json
  • package-lock.json
  • postcss.config.js - requires auto-prefixer, and tailwind.css
  • tailwind.config.js - tailwind plugin configuration JS file. Insert custom tailwind settings in this JS file.

Download Details:

Author: Wesley26

Source Code: https://github.com/Wesley26/wd-react-portfolio

#react #reactjs #javascript

What is GEEK

Buddha Community

Wesley Dzitzer Portfolio Website (ReactJS build)
anita maity

anita maity

1618639156

Responsive Personal Portfolio Website HTML CSS and JavaScript

Demo: https://cutt.ly/TvxhH2T

#portfolio website html css #personal portfolio website tutorial #portfolio website #responsive personal portfolio website #portfolio website html css javascript #responsive portfolio website html css javascript

Nandini roy

Nandini roy

1618667097

Responsive Personal Portfolio Website Using HTML CSS and JavaScript

Tutorial: https://youtu.be/9DDiorNZiyw

#create a portfolio website with html css javascript #personal portfolio complete website using only html css javascript #responsive portfolio website html css javascript #responsive personal portfolio website #portfolio website #responsive website

anita maity

anita maity

1619013192

Create a Personal Portfolio Website Using HTML CSS and JavaScript

Demo Click Here: https://cutt.ly/2vFKuxe

#portfolio website html css #personal website html css #personal portfolio website #how to create a complete peronal portfolio website #responsive portfolio website html css #responsive personal portfolio website html css

Create Portfolio website Using HTML, CSS & Bootstrap

Demo and Download Code

#personal portfolio website tutorial #portfolio website html css javascript #responsive portfolio website html css javascript #portfolio website #responsive web design #portfolio website mobile first

wp codevo

wp codevo

1608041337

RESPONSIVE Personal PORTFOLIO Website HTML CSS And JAVASCRIPT

https://youtu.be/J8g9gyzhEoM

#responsive website using html5 and css3 #portfolio website #one page personal website html css #portfolio website design in html css #css responsive website design #responsive website html css