OK so I am almost finished with my portfolio site.
The site is modular in design utilizing gulp automation, sprites, HTML5, CSS3,
NodeJS, JQuery and more… (I do not have express or react or redux loaded it seems JQuery is the way not sure
Note: This form is on a lightbox pop up that covers the entire screen and has about .86 opacity this is why you can see the website slightly in the background…
#1 The part I am stuck on is sending form data when user types into the contact form… I do not need async behavior it seems,
because it only should send data when the user clicks the submit button…
#2 It seems the data should go to Mongodb: Full Name, Email and How can I help… (text area)
#3 After the data gets sent to the data base it should clear the form data and I should some how be able to retrieve it on my local machine…
Requirements:
A.) It seems the data should be encrypted even though its just 3 fields and not critical…
B.) Are we going to have problems with bots like on wordpress sites?? How to easily stop bot signups…
C.) The reason I choose mongodb for this is for learning purpose, yet if there is a much easier way that is nice please tell me…as this seems really difficult.
Here is my package JSON perhaps if you see what I have you can recommend a process that will work nicely:
{
“name”: “travel-site”,
“version”: “1.0.0”,
“dependencies”: {
“jquery”: “^3.1.1”,
“jquery-smooth-scroll”: “^2.1.2”,
“lazysizes”: “^3.0.0-rc4”,
“normalize.css”: “^5.0.0”,
“picturefill”: “^3.0.2”,
“waypoints”: “^4.0.1”
},
“devDependencies”: {
“autoprefixer”: “^6.7.2”,
“babel-core”: “^6.23.1”,
“babel-loader”: “^6.3.0”,
“babel-preset-es2015”: “^6.22.0”,
“browser-sync”: “^2.18.7”,
“del”: “^2.2.2”,
“gulp”: “^3.9.1”,
“gulp-cssnano”: “^2.1.2”,
“gulp-imagemin”: “^3.1.1”,
“gulp-modernizr”: “^1.0.0-alpha”,
“gulp-postcss”: “^6.3.0”,
“gulp-rename”: “^1.2.2”,
“gulp-rev”: “^7.1.2”,
“gulp-svg-sprite”: “^1.3.1”,
“gulp-svg2png”: “^0.3.0”,
“gulp-uglify”: “^2.0.1”,
“gulp-usemin”: “^0.3.28”,
“gulp-watch”: “^4.3.11”,
“postcss-hexrgba”: “^0.2.1”,
“postcss-import”: “^9.1.0”,
“postcss-mixins”: “^5.4.1”,
“postcss-nested”: “^1.0.0”,
“postcss-simple-vars”: “^3.0.0”,
“webpack”: “^2.2.1”
}
}
Thank you, so much for helping me get through this difficult problem… will be done with front end certification very soon after this…