Week 2 - Project management
Assignment tasks for this week
work through a git tutorial and build a personal site in the class archive describing you and your final project. Include index.html, which links to about.html and wk1.html
Assignment summary
what I achieved/learned this week:
- done a GIT tutorial, to understand what it is, how it work, and how I need to interact with it each week to manage and push my site
- created a new repository for my site
- created a HTML site with key pages that can then be expanded each week
- created a CSS file to style my site
- pushed my site to the remote server
1.0 GIT
Version control
I have now done the https://try.github.io/ GIT tutorial, found it to be quite good! I might also try the ProGit tutorial next. Here is how we did the Git global setup:
- git config --global user.name "userName"
git config --global user.email "myemail@email.com"(Tell Git who you are)
Create a new repository
-
git clone git@gitlab.fabcloud.org:academany/fabacademy/2018/labs/fablabbrighton/your_folder.git (For a remote server)
cd your_folder
touch README.md (touch creates a file with that name above)
git add README.md
git commit -m "add README"
git push -u origin master
...and remember we had to create the SSH Key
here's a typical terminal window showing how I would go about pushing my site.
Some commands I used:
- clear command to clear the screen on terminal
git commit
git --help (will is also be the case for providing help info for any programme, e.g. git, ls, others too! very useful)
furthermore, you can do this for specific commands, e.g. git commit --help (will give help/options for the commit command)
git add filename.abc
git add -A ....to add all files/updates
git push
git pull
git status
git gui
git commit -m "put comments here"
git push -u origin master (this will push the origin upstream (u) to the master branch...
using interted commas "adds comments to the command"
gitlab – can be used as a project management tool, repository, issue tracker. We used this to link our local repo with the fabacademy site using an SSH key generated locally.
brackets (text editor for webdesign)…for me links ONLY TO CHROME (macbook), but this seems to work well.
2.0 HTML, CSS, bootstrap + my personal site
on a mac, Alt + 3 = hashtag # ....very important!
michael's slides: https://gitlab.com/kitobor/html
here are the main HTML commands, note that they all need arrow brackets either side
- h1 to h6 Heading
p Paragraph
a Anchor (links)...note the difference here
ul Unordered list
ol Ordered list
li List item
img Image
div Division
pre is used to use the original formatting....e.g. pasting code from another site or from Brackets...I use this for code table to create a table
th for table header
tr for table row
td for table data
a id="top"...creates the anchor at the top of the page, I put it above the TITLE
a href="#top">Back to top...with bracked a...will take you back to the top...I put this above the bottom line of the page
../ to add a link to a file which is ONE level up, so ../../ will goto a file two levels up! e.g. ../main.css
header nav main aside footer Colours: http://htmlcolorcodes.com/ Color name Hex (R,G,B) Red #FF0000 (255,0,0) Lime #00FF00 (0,255,0) Blue #0000FF (0,0,255) Yellow #FFFF00 (255,255,0)
/* this is a comment in CSS, generally applied to the line below this comment */
DO NOT USE THIS site for tutorials for both: w3schools.com
instead use MDN:
also just searching "how to X in git" works well!
use MBN html learning resource or codeacademy
use kraken.io to resize image optimizer.
I've created a basic html site using brackets, coding from scratch, but I'd like to play around with bootstrap next to see what themes there are.
We've also been given a nice template by our fabguru for our site, so ultimately I will probably use this, but want to have a play first.
Here's a typical brackets window that I would be working in, coding everything in HTML from scratch.
And here's my final site!
3.0 other notes for my own reflection
demand/supply side time management
serial vs parallel development
spiral development...wow I used this A LOT!! and have been really banging on about this to everybody since!
bottom up vs top down debugging
“every week you will run out of time” – document as you work!!! Record successes + failures, questions, issues, etc
man-month myth (book)…and beware 2nd systems
work on project management skills – explicitly…and reflect on this…
For DP401 project, I would like to produce press fit samples for material + thickness + nominal size. From this, develop a press fit guide, with input type of press fit (use limits and fits) + nominal dimension, output dimensions to put into CAD to achieve this type of fit with a worked example. Possibly produce a set of structural joint samples using various joining techniques and test their strength.
For DP402 project, I would like to develop an online laser cutter cost/time calculator from dfx (based on line length calculation and scaled based on material and material thickness inputs). I'd also like to develop a parametrically controlled laser cut example - my kitchen helper design, which also has a net waste minimsation algorithm based on the sheet material size.