Pictures from Austin .Net Meeting December 14, 2015

Justin Self gave a very informative talk to 30 developers at adnug.org  about css positioning.
Here's a few pics of the evening.

Justin describing CSS

Panorama of the crowd

Pizza!

Justin used the tool "Bracket" by Adobe to give a live preview of changes.

My unordered list of jumbled notes:

border: 10px solid blue; #order doesn't matter
border-bottom:... #only for the bottom
margin property can be negative.
"auto" centers element horizontally only.

line height specifies vertical distance between lines of text in container.
line-height: [number | length | % ]
line-height: 4;
line-height: 30pt;

display
display:block; # default width is 100%. Always on same line
display:inline; # width is only based on content. You cannot set a width on it. Can do margin-left and right, but not top and bottom.
display:inline-block; # may have width. operates like a magic block inside inline element. display:none; # hides the element and its space. triggers a reflow.
float:left; float:right; #pushes element left or right. Treated as "display: block" except you can set the width.
clear: left #
clear: both #
visibility: hidden; #like display:none, but does not cause a reflow, keeps its place
position: static; # default, puts the element in the flow
position:relative; #moves element, but does not reflow
position: absolute; # positioned from positioned-ancestor with things like "top: 200px"
position: fixed; # takes it out of the flow, positioned in viewport
top, right, bottom left, only works for positioned elements
z-index # determines the depth position of stacked elements, only works for positioned elements, ie, not "position:static".
to center vertically:
position:absolute; top:50%; margin-top:10px;
margin-left: -25px;
left: -25px; # only on positioned elements

Justin did mention that most developers never sit down to learn CSS, we just learn tiny bits as needed.  I feel the same way, so it was great to get a full 2 hour overview of how positioning really works.

NuGet Package Manager Introduction

NuGet is a popular .Net package manager.  .Net was late to the party for package managers (see RubyGems and apt-get), but it's here and been gaining traction the last few years.

 NuGet relieves the developer from searching the web for common libraries and provides a single place to download most libraries.  NuGet also has a common file structure so it helps to standardize the file structure across projects.

Adding a Library

To add a package to a project, right-click on the project and select "Manage NuGet Packages..."
(If you don't see that on the context menu, you may need to download the NuGet extension on older versions of VS).

Set the source to "Online" and search for your package.  Let's install Json.NET.

At this point the Package Manager does the following:
  1. Creates a solution\packages directory and a "repositories.config" file if not already there

  2. Downloads, typically from nuget.org,  the *.nupkg file into the solution\packages directory and unzips contents including the dlls needed.

  3. Adds a "packages.config" file to project if not already there

  4. Adds references in the project to the libraries in the solution\packages directory

  5. Updates the web.config if needed

Json.Net is now a part of our project.

Removing a Project

The VS GUI for NuGet will also let you uninstall a package.  Removing a package should remove references, package.config entries, but may not remove web.config settings or dependencies.  Always check to make sure all items are removed.

The Package Manger Console

To access the command-line go to Tools/NuGet Package Manager/Project Manager Console

Here are a few common powershell commands for the console

• PM> Get-Package # gets all packages in solution or project
• PM> Get-Package -ListAvailable Elmah # all available named Elmah
• PM> Install-Package elmah # install elmah and all its dependencies
• PM> Uninstall-Package elmah #uninstalls library, but not necessaily its dependencies
• PM> Uninstall-Package elmah.corelib # uninstalls dependency
• PM> Install-Package jquery -Project MyProject3 # install in specific project regardless what dropdown says
• PM> Install-Package jquery -Version 1.5 # not in GUI
• PM> Get-Package -Updates # show updates available
• PM> Update-Package jquery # updates all packages in solution regardless of scope dropdown
• PM> Update-Package jquery -Version 1.5 -Project MyProject2 #changes version just for a specific project
• PM> Update-Package -reinstall jquery -Project MyProject2 # re-adds references

More command-line docs at docs.nuget.org

Version Control

We check in our "packages.config" file in each project to our version control system, Perforce. But sometimes Perforce does not see that a "packages.config" file has changed and we manually add it to Perforce.

We don't checkin any of the packages in our packages directory, and rely on the build system to grab the missing libraries from the NuGet repository. Also the "packages/repository.config" is not checked in, but rebuilt each time.

What3Words, A Great Idea to Share Locations

What3Words.com is a wonderful idea to bring rational addressing to the world.
What3Words divides the world into 3 meter by 3 meter grids and assigned each grid square a triplet of words, like "browser.bride.uniforms".  Now, to identify a place in the world you use their three words.  You could use lat/long, which is more specific, but is harder to memorize.

I can see this saving a lot of energy and reducing the carbon footprint of delivering packages in parts of the world where addresses are not easy.  Tokyo is notorious for having complex addressing.  With What3Words, a taxi cab or ups driver would know exactly where to go.

Especially in rural areas or camp sites, What3Words would be helpful. You could tell your late Boy Scouts to come red.frog.one which is easier than go 200 yards down the stream from campsite 12, then 50 yards to the South.

My office is at 206 East 9th, Austin TX. The lat/long is 30.270568/ -97.739911,
but its easier to remember "quirky.together.styled".
Or a few grid squares over we have "provider.indeed.sensual" which could be more memorable.
(Perhaps if What3Words catches on, office rental space with catchy 3 words would command a premium)

What3Words really has a potential if Google and Apple will integrate it into their mapping products.