Author Archives: Chris Kottmyer

Introduction to Python Courses

Dear Reader,

I am providing free lectures on intro-to-python.  Salesforce supporting me through their voluntary time off program.  Salesforce.com under it’s 1-1-1 program gives each employee 7 days to work on voluntary projects.

You can find the lectures here:

Lectures

Code

Application Class

The 4th class will be held at Cambridge Innovation Center, 1 Broadway, Cambridge Ma on Saturday November 18th 2017.  They are held every 2nd Saturday afterwards.  Possible projects:

  1. A mini Q/A program.  It introduces the concept of regex using re.
  2. Opening a file in python, reading it’s lines and analyzing words.
  3. Utilizing SimpleHttp server host a basic webpage with <p>, <h1> and <div> tags.  This is a simple introduction to a one-line web server.

The curriculum is free and I encourage people to submit practice problems to the GitHub repository.

Moodle Platform

Moodle is an open-source learning platform. Often, Moodle is used in universities.  I plan on implementing a Moodle instance to host lectures online.

Spammy E-mails, Great!

Moodle implementation has stalled.  I decided to host e-mail service myself.  I did get smtp and e-mail server up.  The obstacle now is getting Google and other e-mail providers to realize my E-mail isn’t spam.

Why is it considered SPAM?

Evidently, you can send an E-mail from chriskottmyer.com, but claim it originated from john smith.com.  Web industry has developed two processes to prevent this: SPF and DKIM.  SPF creates a guarantee that a message from johnsmith.com originates from johnsmith.com.  DKIM encrypts SMTP header preventing snoopers from changing that in transit.

Apache and VPL!

After resolving the spam crisis, I will have to deal with an annoying URL issue.  Moodle loves my IP address.  It loves it so much, it’s bound it to all the URLs.  I don’t like!  I’ll have to make either application-level change or re-route in Apache to resolve.

Having Moodle is great.  It doesn’t support programming assignments out of the box.  Luckily, some wonderful academics invented a plugin called the VPL.  It takes code presented to the web, submits it to a restrictive JVM-based sandbox and runs it.  It should prevent any malicious hackers from hijacking the server (crossing fingers).  It also supports automated grading of coding exercises (yay!).

Both issues aren’t blocking the lectures!  Hopefully everyone can enjoy those!

Best,

Chris

 

Yoast App

Yoast Application for WordPress

Yoast Application for WordPress

Introduction

Yoast (website) is a group dedicated to SEO, which provides a free WordPress plugin to improve your website.  The plugin has useful features.  For example, it computes a readability score and scores your post for Google keywords:

Yoast plugin

Readability

Yoast plugin makes suggestions to improve readability of your blog posts.  On Yoasts website, you will see a summary of how to plan blog posts:

Practical tips to set up a clear text structure

Within the practical tips webpage, Yoast explains the importance of headers (<h1>,<h2>…).  Headers, larger text found above paragraphs, provide context about the paragraphs that follow.  This provides Google with benefit when matching search queries with your website.  The post discusses the use of transition words to connect and smoothen the flow of the paragraphs.  Yoast app automatically calculates this for the blog post you are typing.  It recommends that 30% of words be transition words.

Transition words are one of three main metrics I often work on to improve posts.  The other two are active vs passive voice and Flesch Reading Score.  Active voice places the emphasis of the sentence as the main object instead of the subject.  For example, “Chris plays the trumpet” is active voice vs passive “the trumpet is played by Chris.  Active voice is considered less confusing then passive voice. With passive voice, it is harder to figure out what the sentence is about.  More about passive voice below:

Passive voice

The last metric on readability is the Flesch Reading Ease test (wiki:Flesch-Kincaid readability test).  Flesch test provides a formula that is supposed to correlate with ease of use:

Formula

Flesch-Kincaid Formula

Results

Flesch Score Results

Formula Conclusion

The major conclusion from this formula is that you want short sentences with few syllables.  This style of writing correlates with easier comprehension.  It also decreases the odds people will run away from your website.

 

Key Words

Another section of Yoast focuses on key words.  Key words are words in Google search queries that you would like your post to be associated with.  For example, I might want this specific blog post to show up when people type: “Improve blog post readability” or “Yoast features” into Google.  The underlined words would be my key words. The plugin provides key metrics on your chosen keyword:

Keyword Analysis

How do I look on Google?

The last cool feature worth mentioning is you can edit how you look like on Google.  Evidently, a website can provide some metadata (data about the webpage to Google), which tells Google how to present your webpage as a search result.  The below form provides SEO Title, the blue name (hyperlink) of your website.  A slug, which is the end of your url, in the below case (yoast is the slug): christopherkottmyer.com/blog/2017/09/22/yoast.  As well as the description google uses for your webpage.

Google Metadata

Overall, Yoast provide a really cool tool set to improve your blog posts.  It also provides a study into what an expert thinks is great content.  Hoping this helps readers develop better content and improve their own readability!

Best luck blogging!

Chris

Related ChrisKottmyer.com Posts:

SEO for Growth – Bend Google to your Way!

SEO for Growth

SEO for Growth Book

SEO for Growth

Bloggers often make fortunes with financialsamurai.com being a great example.  The question, how do you become a successful blogger and more importantly a successful marketer.  SEO for Growth by John Jantsch and Phil Singleton discusses how you can optimize your blog to beat those Google Search rankings and be listed on the first page.  That can be the difference between getting no traffic and being like this cute pug watching money fall from the sky.

Cute pug watching $1 bills fall

Isn’t he cute!

What does Google hate?

Spammy pages that look more advertisement then content!

You forgot smart phones exist!

You cover half your webpage with Eye Junk!  The other half is infinite scrolling.

You are a copy-paste king/queen.  Very original!

What Google Likes!

Google is in the business of answering search queries.  Anything that detracts from that is bad business.  Google is interested in original content that best answers search queries and penalizes websites that produce noise or distraction. To simplify marketers and web designers lives Google provides resources on best practices curate great content and provides tools to analyze your website (site maps, simulations of google crawls, viewing data and more).  Google also graciously provides paid advertisement as well:

Adwords!

Each day, 3.5 billon people ask Google a question.  Over a single year, that is 1.2 trillion searches.  That’s as many searches a day as Donald Trump is estimated having in cold hard cash.  You as an advertiser wants a slice of those people’s attention, which is where Adwords comes into (word) play.  Adwords let’s you bid on search terms, the questions people ask.  Rarer search terms have less demand.  SEO for Growth says this is fertile ground as you can bid for more targeted terms that better represent your customer.  In turn, your customer is more likely to convert into a purchase or blog reader.

Google Analytics! 

Everyone loves a dashboard.  Don’t they?  Google Analytics might be a Marketers Mecca in that it prevents a view of your audience.  Do people coming to your websites like your article on clothing or would rather stalk your About me page?  Google Analytics also tracks other useful information.  For example, where did the person originate?  Did they start on another 3rd party website or where they intensively Googling for an answer?  This type of information can help you fine-tune what appeals to your audience and, if you are clever, be utilized for A/B split test.  A/B split testing is when you send people to two webpages that differ by a single feature.  You then see who stays around, buys or clicks on more ads (group A or B).

Google of course provides a lot more tools than presented in this blog.  I will most likely get into more details in the future.  For now, I have a laundry list of site improvements mentioned in SEO for Growth!

Hopefully, with these tools, I can finally have my website pay for my next Latte!

Best Luck Blogging,

Chris

 

Learn Web Development: Backend Certificate

Dear Readers,

In the last few posts, I explored freecodecamp.org, a non-profit that assists people in learning how to develop websites for free.  I also show cased 10 quickly developed front-end prototypes.  Why is free code camp awesome, it’s a free curriculum that prepares you for a Junior Web Developer role (Salary).  It’s also great practice if you want to learn JavaScript, HTML and CSS.  As a database engineer, I really wanted to learn more about these technologies as almost everything touches the web in some way.  In this post, I will talk a bit more about backend-certificate and my current progress towards getting the certificate.

FreeCodeCamp.org provides 3 certificates.  The first one is called the front-end certificate.  It is the one that I would recommend starting with.  It begins with very simple elements of a webpage like text, images and buttons.  It then progresses through 200 lessons until you can develop TicTacToe and the Simon Game.  The first 150 or so lessons will take the average person approximately 5 minutes each and so can be done during your daily commute (train).  The remaining ones take significantly more time, but are well worth going through.

The next certificate I’m attempting is the backend certificate.  Front-end development involves the actual webpage, the buttons, text and images that are presented in your browser.  Front-end applications tend to utilize your computer and the resources tied to it.  The backend certificate focuses more on sending and processing data stored on your a computer to your browser.  Why would anyone want to store data on a separate computer, process it and send it to your web browser?  First, you can process things in one location preventing a bunch of other computers from doing the work.  This is the focus of cacheing.  Second, you want a guarantee that your data doesn’t change, which is near impossible to do if you don’t have control of the computer.  Third, you can take all this data and often aggregate it to look at interesting group behavior.  These are just a few examples why you’d want a “backend” server.

The current curriculum focuses on a framework called Node.js.  Node.js is written in JavaScript and is a framework for dealing with network connections.  A good example of a network connection is going to your facebook profile and making a post.  It involves, getting your profile page from a Facebook backend server called a http get request and then providing data to facebook in the form of your post called a http post request.  Both these requests need to be handled by some form of network software, one to get your profile information and the other to store the new data in the database, permanent place for your data.  Node.js specializes in handling these types of connections.  In fact, it can handle hundreds of connections in a few seconds from many different people.

What other types of technology are covered and what would you learn from this curriculum:

 

 

npm – Node Package Manager, when you are dealing with websites there are a lot of moving pieces.  You want to be able to set up node.js to handle connections.  You also want to build logic around those connections, are you a bank processing credit card balances or is it just retrieving your blog post.  NPM allows you to save a copy of that logic and makes useful logic available for others to use.  It also provides a way to do automated tests.  If you decide to for example change the functionality of your blog, you can run tests to see if it breaks your websites.  Broken website often results in a blank page or missing elements.  In the course, you do one whole module consisting of about 12 tasks that teach you how to manage your code.

node.js – Node as mentioned above is a library that deals with network connections.  Many people use Node specifically for websites, but you can use it for other situations as well (maybe forwarding database connections).  In this curriculum, there are two lessons that utilize node.  One of the things you will end up building is a service where you type in a url with a date and it will convert it into different timezones.  These backend services can of course become significantly more complicated.

express.js – Express is another JavaScript library, but focuses more on building websites.  Express.js would set up for example a template of how a Facebook profile would look like (Picture on the top left, a background picture, short summary and posts below) and bind it to a specific url.  It would also create separate urls for your facebook profile vs your activity feed.  The lessons focus on very simple webpages and templating.

mongodb – mongodb is a database and is not written in JavaScript.  It focuses on storing data on the backend server and is optimized for quick retrieval.  Mongo itself is called a document store, which means that it does not store things in tables like a spreadsheet, but rather as a set of keys and collections.  One neat thing about this is that you can store a set of collections within a collection, which makes it very flexible.  An example of this type of data can be seen here (it is called JSON):

Example Google Maps JSON File

MongoDB section has about a dozen tasks and focuses on storing data, retrieving it and using it in a web application.  This is important in that you can retrieve the data for a specific person and just put it in a template (or webpage).  Hence, your name, summary and posts in facebook are all stored in the database and are unique to the individual (database like Mongo), but are presented in the same way as a profile page (node.js/express.js provide template and logic).

In the next few posts, I will talk about the second part of the backend certificate, which are the 10 projects that utilize the tutorials mentioned previously to produce products people can use.  After doing those 10 projects, a person at freecodecamp.org could potentially develop backends similar to quora.com or facebook.com.  One thing to note, even though that website would look similar to facebook, it would be missing the messaging and not operate at the scale of Facebook.  Handling webpages for billions of users is a much harder problem.

Best,

Chris

Learn Web Development: Front End Certificate – Finished!!!

Dear Reader,

I finally finished the JavaScript front-end course.  That involved two last projects, which I’ll present here.  Warning these are not mobile optimized and look ugly on a phone:

Pomodoro Clock:

Pomodoro clock is count-down clock, which allows you to switch between work and break sessions.  You can adjust the work and play dials to choose how many minutes you want to work or play.  If you press the large Session button, the count down begins.  This project wasn’t that difficult to complete.  The hardest thing was figuring out how to create a circle, center it and then start a timer.

TicTacToe:

This is a tictactoe board with a very “dumb” AI.  It starts by allowing you to choose Xs or Os.  It then continues until either you win, the computer does or a draw occurs.  The AI plays a rather simple strategy:

  1.  If the AI can win that turn it.  It plays the winning move.
  2. If the AI will lose this turn, it will block the player from winning.
  3. If the AI can’t win or block a losing move, it finds the diagonal, column or row with 1 of it’s own tokens in it and no opposing token.
  4. If the previous 3 positions do not occur, it picks a random diagonal, column or row with no opposing token in it.

At first when I played this AI, I thought it was pretty smart.  I soon realized that playing the bottom 2 corners and one of the top corners results in a win for the player every time (at least for O).

Simon Game:

Simon is an old 1990s Toy that plays a sequence of colors that the player has to match.  It starts with a sequence of 1 color and increases it by one if the player matches the entire sequence without an error.  It does this up to a sequence length of 20 and then declares the player a winner.  The Simon game has a strict mode, which will reset the sequence to 1 on a player error.

This specific implementation took me around 4-5 hours.  The difficulty came from the fact that JavaScript is asynchronous.  This means code that looks sequential in the file executes at the same time.  This came as a shocker to me when I pressed the start button, was immediately declared a winner and then watched the entire circle turn lightblue 2 seconds later.  What had happened is all 20 sequences had played out at the same time including all… 20 + 19 + 18 … 1 button presses (2 seconds later).

To resolve this specific issue. I created an event on the color buttons.  If the player had pressed the correct sequence of colored buttons to match the computer’s color sequence, it would add a new color to the color sequence and repeat it back to the player.  To make sure the play timing of the color/sounds  was correct, I iterated over the index multiplying each index value i by 2000 milliseconds.  This ends up solving all those strange asynchronous bugs and makes the game playable.

After this project, I finally got the front-end certificate for free code camp.  It was a cool 6 weeks of part-time coding.  The last 2 weeks were especially exciting, because I got to do a deeper dive into JavaScript itself.

Best,

Chris