1
0
mirror of https://github.com/mgerb/mywebsite synced 2026-01-11 18:32:50 +00:00

Added blog

This commit is contained in:
2015-07-21 13:20:21 -05:00
parent c17442131f
commit 38c9fab9cc
10 changed files with 317 additions and 52 deletions

View File

@@ -0,0 +1,60 @@
div.blog-post
h2.blog-post-title First Blog Post
p.blog-post-meta July 21st 2015 by Mitchell
p.
My first blog post introduces this website and the motives behind it.
I discuss setting up a Node.js webserver for the first time and
my experiences with it thus far.
hr
p.
I have had this site up for awhile now, but I've decided to turn it
into a blog style website, more or less. I first started working on the site
because I wanted to learn new web development tools, in this case, Node.js and MongoDB.
p.
I already had previous experience with SQL databases and other server side scripting
languages such as PHP and JSP, but I heard good things about Node.js and I wanted to
familiarize myself with a NoSQL database. At first, Node.js was a bit confusing to work
with and figure everything out. Now that I am starting to get the hang of Node and MongoDB
I am enjoying them more and more.
h2 Setting up Node.js for the first time
p.
There are multiple ways to get up and running with Node. Node uses "modules" and has some
that are already built in. Others need to be installed with the NPM package manager, which
will become your friend. I am going focus on installing Node.js with Express, which is a
web framework for Node.js.
code$ sudo apt-get install nodejs
br
code$ sudo apt-get install npm
br
p.
Once you have both Node.js and NPM installed, install Express and MongoDB.
We are going to install and use express generator to easily create a skeleton that we can
work from.
code$ npm install express-generator -g
br
p
|Based on your system, installing MongoDB may be a bit different.
a(href="http://docs.mongodb.org/manual/") Here is a guide on how to install.
p Once express generator is installed, it is extremely simple to set up a new Node application.
code$ express myapp
br
p This will generate a new fold "myapp" with prebuild folders and files.
code$ cd myapp
br
code$ npm install
br
code$ npm start
p.
Now as easy as that sounds, you have a Node web application running on your machine.
You can navigate to your web app at localhost:3000 (It's configured to use port 3000 by default)
p
|Express organizes everything nicely in the
a(href="https://en.wikipedia.org/wiki/Model%E2%80%93view%E2%80%93controller") Model View Controller
|software pattern. Folders are split up into views, routes, and public files.
|If you are implementing a database, you would also create a "models" folder.
|There is also a folder which contains Node modules.
|When you use NPM to install new modules this is where they will be located.
p.
Node is a very powerful tool that I plan on exploring more in the future.
As development of this site continues, I plan to submit more content similar to this.

View File

@@ -3,52 +3,88 @@ extends layout
block content
div.header
div.centerDiv
h1.headerText.textCenter mitchellG.me
nav.blog-nav
div.container
h1.textCenter Enter Reminder
form(action="/", method="post")
div.form-signin
Span Phone Number:
if (number != null)
Span.colorRed= " " + number
br
input.form-control(required type="text", name="number", placeholder="555-555-5555")
br
Span Carrier:
select.form-control(name="carrier")
option(value="@vtext.com") Verizon
option(value="@txt.att.net") AT&T
option(value="@tmomail.net") T-Mobile
option(value="@messaging.sprintpcs.com ") Sprint
option(value="@vmobl.com") Virgin Mobile
option(value="@mmst5.tracfone.com") Tracfone
option(value="@mymetropcs.com") Metro PCS
option(value="@myboostmobile.com") Boost Mobile
option(value="@sms.mycricket.com") Cricket
option(value="@messaging.nextel.com") Nextel
option(value="@message.alltel.com") Alltel
option(value="@ptel.com") Ptel
option(value="@tms.suncom.com") Suncom
option(value="@qwestmp.com") Quest
option(value="@email.uscc.net") U.S. Cellular
br
Span Date:
if (date != null)
Span.colorRed= " " + date
br
input.form-control(required type="text", name="date", id="datepicker" placeholder="MM/DD/YYYY")
br
Span Time:
if (time != null)
Span.colorRed= " " + time
br
input.form-control(required type="text", name="time", id="timepicker" placeholder="12:00am")
br
Span Message:
textarea.form-control(required type="textarea", name="message", placeholder="Type your message here...")
br
input(hidden type="text" name="timeZone" id="timeZone")
input(type="submit", value="Remind Me", id="submitButton").btn.btn-lg.btn-primary.btn-block
div.blog-header
h1.blog-title mitchellG.me
p.lead.blog-description A "blog" about computer related projects that I find interesting.
div.row
div.col-lg-8.blog-main
include ./blogposts/7-21-15.jade
div.col-sm-4.blog-sidebar
h1.textCenter About Me
img.aboutMeImage.center.img-rounded(src="images/aboutme.jpg")
br
div.sidebar-module.sidebar-module-inset
p.
I'm 22 years old and I'm currently attending Winona State University as a Computer Science major.
I am graduating in Spring of 2016 and plan to pursue a career in the field of software development.
a(href="https://www.linkedin.com/pub/mitchell-gerber/b3/391/125" target="_blank")
i.icon-large.icon-linked-in
div.sidebar-module
h3.textCenter Enter Reminder
form(action="/", method="post")
div.form-signin
Span Phone Number:
if (number != null)
Span.colorRed= " " + number
br
input.form-control(required type="text", name="number", placeholder="555-555-5555")
br
Span Carrier:
select.form-control(name="carrier")
option(value="@vtext.com") Verizon
option(value="@txt.att.net") AT&T
option(value="@tmomail.net") T-Mobile
option(value="@messaging.sprintpcs.com ") Sprint
option(value="@vmobl.com") Virgin Mobile
option(value="@mmst5.tracfone.com") Tracfone
option(value="@mymetropcs.com") Metro PCS
option(value="@myboostmobile.com") Boost Mobile
option(value="@sms.mycricket.com") Cricket
option(value="@messaging.nextel.com") Nextel
option(value="@message.alltel.com") Alltel
option(value="@ptel.com") Ptel
option(value="@tms.suncom.com") Suncom
option(value="@qwestmp.com") Quest
option(value="@email.uscc.net") U.S. Cellular
br
Span Date:
if (date != null)
Span.colorRed= " " + date
br
input.form-control(required type="text", name="date", id="datepicker" placeholder="MM/DD/YYYY")
br
Span Time:
if (time != null)
Span.colorRed= " " + time
br
select.form-control.timeForm(name="hours")
-for(var i = 1; i < 13; i++)
option(value=i)= i
select.form-control.timeForm(name="minutes")
-for(var i = 1; i < 60; i++)
option(value=i)= i
select.form-control.timeForm(name="ampm")
option(value="am") AM
option(calue="pm") PM
br
br
Span Message:
textarea.form-control(required type="textarea", name="message", placeholder="Type your message here...")
br
input(hidden type="text" name="timeZone" id="timeZone")
input(type="submit", value="Remind Me", id="submitButton").btn.btn-lg.btn-primary.btn-block
footer.blog-footer
p Site created and managed by Mitchell Gerber
Span &#169;2015
br
Span Glyphicons provided by
br
a(href="http://glyphicons.com/" target="_blank")
Span glyphicons.com

View File

@@ -6,6 +6,7 @@ html
link(rel='stylesheet', href='/stylesheets/style.css')
link(rel='stylesheet', href='jquery-ui-1.11.4/jquery-ui.css')
link(rel='stylesheet', href='jquery-timepicker/jquery.timepicker.css')
link(rel='stylesheet', href='bootstrap/css/bootstrap.icon-large.min.css')
link(href='http://fonts.googleapis.com/css?family=Arvo', rel='stylesheet', type='text/css')
body
block content
@@ -13,5 +14,4 @@ html
script(src="bootstrap/js/bootstrap.js")
script(src="jquery-ui-1.11.4/jquery-ui.js")
script(src="jquery-timepicker/jquery.timepicker.js")
script(src="javascripts/notify.min.js")
script(src="javascripts/custom.js")