Exploring Dev Tools - Using Console

Dev Tools are a section in the browsers that are there to help us debug and fix issues on our sites. This is the first of a series of posts on dev tools. Instead of doing it as just 1 big posts I'm going to break it down into an on going series of some of the features that make our work better and our bug hunting easier.

Console

Lets start with the console

console.log

We all know and use the log

console.log("Sonic Boom");

It's handy and allows us to see where we are, it can even show us the value in a field

var name = "Serversncode";

console.log(name);

Info

To just print off some information. It's similar to log but will show an info symbol.

console.info("oh info only here");

Warn

We also have a warn

console.warn("Getting a warning");

console.warn will show a warning in our dev tools.

Errors

We have two ways to show an error.

console.error("This is an error");

console.exception("This is an expection");

Time

I find the time functions in the console are really useful

console.time();


console.timeEnd();

console.time will start our timer. When we have our function finished we use console.timeEnd(); to stop the timer and show the time used by the function.

It's really useful for performance checking.

Table

This is one I don't use enough because I keep forgetting it's there.

With console you can display a table of an array. This makes it easier to see what is in the array your working with.

console.table(arrayname)

Colours

Yes you can change the font size and colour of the console messages.

console.log('%c%s', 'color: blue; font-size: 18px; font-weight: bold','Works!');

Clear

To clear the console of all messages just run.

console.clear();

This is really handy when you want to see just what is going on with your code.

Dev Tools are a section in the browsers that are there to help us debug and fix issues on our sites. This is the first of a series of posts on dev tools.…

Read More

.Net Core and Docker

Building .net core applications into Docker containers. I've spent a bit of time lately moving some of my older applications into docker containers in dotnet core 2.0 and 2.1.

I've only started exploring docker with dot net core and what we can do and so far it really has changed how I think about what I'm doing and the way I am building things.

Demo site: https://dotnetdocker.serversncode.com/ Source code for this site is available https://github.com/mordin/Serversncode-Docker-demo

With .Net Core being on the edge things change. I've started this post and the https://dotnetdocker.serversncode.com as a way to play around with docker and understand it more.

I've hosted the site on a linode server. For more on setting up linode with docker check out setting up docker on linode and nginx reverse proxy for docker.

Working with Docker in .Net Core

With a dotnet core app we need to add a dockerfile to the project. This will do the build of our application and load it into the docker container and build it.

Docker File

.Net Core 2.0

While 2.0 is not going to be supported in the long term it's where I'll start with that.

FROM microsoft/aspnetcore:2.0 AS base
WORKDIR /app
EXPOSE 80

FROM microsoft/aspnetcore-build:2.0 AS build
WORKDIR /src
COPY *.sln ./
COPY ServersncodeDemo.Web/ServersncodeDemo.Web.csproj .Web/
RUN dotnet restore

COPY . .
WORKDIR /src/ServersncodeDemo.Web
RUN dotnet build ServersncodeDemo.Web.csproj -c Release -o /app

FROM build AS publish
RUN dotnet publish ServersncodeDemo.Web.csproj -c Release -o /app

FROM base AS final
WORKDIR /app
COPY --from=publish /app .
ENTRYPOINT ["dotnet", "ServersncodeDemo.Web.dll"]

.Net Core 2.1

Next we move to .net core 2.1 which will be supported long term.

FROM microsoft/dotnet:2.1.402-sdk-alpine3.7 AS build
WORKDIR /app

# copy csproj and restore as distinct layers
COPY *.sln .
COPY ServersncodeDemo.Web/*.*.csproj ./ServersncodeDemo.Web/
COPY ServersncodeDemo.Data/*.*.csproj ./ServersncodeDemo.Data/
RUN dotnet restore

# copy everything else and build app
COPY ServersncodeDemo.Web/. ./ServersncodeDemo.Web/
COPY ServersncodeDemo.Data/. ./ServersncodeDemo.Data/
WORKDIR /app/ServersncodeDemo.Web
RUN dotnet publish -c Release -o out

FROM microsoft/dotnet:2.1.4-aspnetcore-runtime-alpine3.7  AS runtime
WORKDIR /app
COPY --from=build /app/ServersncodeDemo.Web/out ./
ENTRYPOINT ["dotnet", "ServersncodeDemo.Web.dll"]

Docker Build

I have a blog post https://serversncode.com/docker-commands/ that covers common commands.

First up we build our docker image and give it a name.

docker build -t NAME .

Next we run it locally.

docker run --name NAME -d -p 8080:80 NAME

That's it, I've run a container and pointed the port 8080 to the default port of 80. In my docker file I never changed the port from 80. To change the port of your docker file use the

EXPOSE 8040

command to tell it to use a different port than 80.

What next

Next I'll start getting into the details of the docker file how it's created and what it all means.

Building .net core applications into Docker containers. I've spent a bit of time lately moving some of my older applications into docker containers in dotnet core 2.0 and 2.1.I've only started exploring docker with dot net core and what we can do and so far it really…

Read More

Going Serverless

Over the last few years as technology has improved and the cloud providers built out more and more infrastructure, serverless began to grow.

Serverless doesn't mean there is no server. What serverless means is that you don't have to worry about the server. The provider does.

This allows us to focus on our functions and code. What our functions do without worrying about managing updates to our server or running virtual machines. We don't even have to worry about scaling up or down.

Options:

Azure Functions

I've already been using Azure functions alot and I've a bunch of blog posts on Azure Functions already: Azure Functions

But as it stands I'll find it hard to switch I like Azure functions. They are quick and easy to setup and run.

Google Functions

Google has a few options for serverless. Google Functions is built into the Google cloud.

FireBase

Firebase is another option from Google for serverless

AWS Lambda

AWS lambda is the offering from AWS for serverless. It is a bit more tricky then the others to setup and get running.

Cloudflare Workers

Cloudflare have started into the serverless world with Cloudflare workers. Cloudflare workers give developers a place to deploy our code closer to the customers.

Over the last few years as technology has improved and the cloud providers built out more and more infrastructure, serverless began to grow.Serverless doesn't mean there is no server. What serverless means is that you don't have to worry about the server. The provider does. This allows us to…

Read More

Docker Commands

As I dig deeper and deeper into Docker. I'm finding some really useful commands that I have to keep using and reusing. As I use and learn more I will add to this guide.

Docker build command

docker build -t webapp .

Docker Tag and Push

docker tag webapp *.azurecr.io/webapp
docker push *.azurecr.io/webapp

Docker container management

Pull the latest image

docker pull *.azurecr.io/webapp

Run Container

docker run --name webapp -d -p 8090:80 *.azurecr.io/webapp

Run a container with a name of webapp, expose port 8090 and route to port 80 on the container.

Running containers

docker ps

Stop container

docker stop a456721

Remove container

docker rm a456721

This can only be run on stopped containers.

As I dig deeper and deeper into Docker. I'm finding some really useful commands that I have to keep using and reusing. As I use and learn more I will add to this guide.Docker build commanddocker build -t webapp .Docker Tag and Pushdocker tag webapp *.azurecr.io/webapp docker…

Read More

Create an Azure Container Registry

I decided to run my own registry, the more I got into docker and the more stuff I wanted to run I decided to give it a try.

It's very straight forward to spin up an Azure Container registry

Pricing

There are 3 tiers to the pricing for an Azure Container Registry.

Basic:

Price Per Day: EUR 0.141

Storage:  10 GB

Total Web Hooks: 2

Standard:

Price Per Day: EUR 0.563

Storage:  100 GB

Total Web Hooks: 10

Premium:

Price Per Day: EUR 1.406

Storage:  500 GB

Total Web Hooks: 100 - Can request more

Geo Replication: EUR 1.406 per region.

Additional Storage

Basic, Standard, Premium  €0.003/day Per GB

Create Azure Container Registry

In the Market place, head to the "Containers" Option, select the "Container Registry"

Create an Azure Container Registry

Then we need to setup our new registry.

Azure Container Registry

Once you create the new registry we wait for Azure to create it and tell us it's ready.

Azure Container registry

Next we need to get access to our new registry so we can log in and load our images. In the registry menu, select "Access Keys" - I set the admin user to enable so I can use a username / password to access my container registry.

Azure Container Registry Access Keys

Once you have these we need to log into it from docker, by default docker will log into docker hub.

docker login serversncodedemo.azurecr.io

This will then prompt for the username / password from the Azure container registry Access keys.

That's it your now logged into your own Container registry.

To push an image to your own registry you need to tag the image as your registry.

docker tag demowebapp serversncodedemo.azurecr.io/demowebapp
docker push serversncodedemo.azurecr.io/demowebapp

I decided to run my own registry, the more I got into docker and the more stuff I wanted to run I decided to give it a try.It's very straight forward to spin up an Azure Container registryPricingThere are 3 tiers to the pricing for an Azure Container Registry.…

Read More