Sunday, January 22, 2017

[SOLVED] 1&1 Domain and /defaultsite redirecting

The domain that I've initially registered with 1&1 which I've transferred to another registrar kept on redirecting to "*.com/defaultsite". I thought I could just search (grep) the file in the system that's causing this redirection. Unfortunately, I was not able to solve this way.

Searching the web for solution, I found individuals having the same problem. It seems that most of them, if not all, have registered with 1&1. This was not an issue with 1&1 but it seems, with my limited knowledge, they are the only one that is using "/defaultsite" URL path.

Defaultsite issues

The solution offered by members of certain forums that I've visited was not able to solve the issue either. Some have suggested to restart the router to clear the DNS entries. Some have suggested it has something to do with 1&1 and that the name servers should point correctly to the new one. I have verified that it is correct, since it was calling the 404 page of the Ghost blog app that I've installed.

I've revisited a forum that I've quickly skimmed over and read the last solution hidden from the pagination. It was there that the a user was telling the original poster to just clear the browser's cache. Voila, it worked indeed. This should have been standard procedure for me.

TL;DR: Clear the browser's cache.

Sunday, September 4, 2016

Verify files without installing apps in Windows 7/8/10

During the WinXP days, I've been using FCIV, md5summer or other tools just to get a file hash. The hash is useful to verify legit installers, check duplicate files, and verify if your PC is infected by a malware.

I've been accustomed to using sha1sum or md5sum when I've embarked on a journey of using Ubuntu. Now I'm back in using Windows, specifically Win10, I'm in a situation where I need to hash some files.

In my search of built-in alternatives just like in Ubuntu, I've stumbled upon a solution from Stackoverflow where it suggest to use certutil.exe. This is how you use the tool to extract the file's md5 hash:

certutil -hashfile setup.exe md5

This is how you use the tool to extract the sha1:

certutil -hashfile setup.exe sha1

This is their respective output for the same file I've used:


The certutil.exe tool comes handy when you don't want to install app that you won't be using very often. Now back to coding.

Sunday, August 28, 2016

Using outDir on Angular 2 QuickStart

I'm new to TypeScript version of Angular 2 and I'm following the tutorials from the web, particularly YouTube. One thing I noticed from some of the presenters' setup was that the transpiled code do not show in the editor. I'm curious on how to achieve the same setup as I want to hide the .map and .js files on the editor I'm using which is Visual Studio Code.

Some of the answers from StackOverflow suggests using .gitignore to hide the said files. Unfortunately, my limited knowledge and patience can't get the suggestion to work.

Another option I stumbled upon was to use outDir from the compilerOptions. The outDir option saves the transpiled code to a specified directory. I was able to successfully move the .map and .js files to the build directory using the tsconfig.json setting below:

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "outDir": "build"
  }
}

I'm testing using the Angular 2 QuickStart files from the link below: https://angular.io/docs/ts/latest/quickstart.html

The option for the outDir I've used above broke the code. Digging for answers I've finally got them to work. So to use outDir for the 5 minute QuickStart files, we have to modify both tsconfig.json and index.html to like the code below:

tsconfig.js
{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false,
    "outDir": "build/app"
  }
}

index.html
<html>
  <head>
    <title>Angular 2 QuickStart</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="styles.css">

    <!-- 1. Load libraries -->
     <!-- Polyfill(s) for older browsers -->
    <script src="node_modules/core-js/client/shim.min.js"></script>

    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>

    <!-- 2. Configure SystemJS -->
    <script src="systemjs.config.js"></script>
    <script>
      System.import('build/app').catch(function(err){ console.error(err); });
    </script>
  </head>

  <!-- 3. Display the application -->
  <body>
    <my-app>Loading...</my-app>
  </body>
</html>

Now I can continue my Angular 2 TypeScript adventure without being distracted by unwanted files from my IDE of choice.

If this post helped you solve the same issue as I have, please let me know by posting a comment below.

Now back to coding...

Sunday, August 21, 2016

Setup PrismJS Syntax Highlighter to Blogger

If you are a coder and want to share your code to the world using Blogger, you'll notice that it does not come with a syntax highlighter. A syntax highlighter is a plugin/module/script that adds styles to code snippets to make them look presentable to the reader.

There are other websites such as Github's Gist, Plunker, Pastebin and etc that allows you to embed code in your blog. The SEO folks were concerned that strings shown in the embedded tag/frame will not be indexed by Google. They suggested that if you rely on your code to do the SEO talking, its better to paste your code on your blog and have it formatted by a syntax highlighter.

In this post, I'm going to show you how to setup PrismJS within Blogger. We are going to edit the Template > Edit HTML to add the PrismJS' CSS and JS files hosted from CDNJS.


First, copy the following lines and add them on top of the </head> tag.
<link href='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/themes/prism.min.css' rel='stylesheet'/>
<script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/prism.min.js' type='text/javascript'/>

If you want to have line numbers on your code snippet, include the following lines as well.
<link href='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/plugins/line-numbers/prism-line-numbers.min.css' rel='stylesheet'/>
<script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/plugins/line-numbers/prism-line-numbers.min.js' type='text/javascript'/>

It should look like this:
    <b:include data='blog' name='google-analytics'/>
    <link href='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/themes/prism.min.css' rel='stylesheet'/>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/prism.min.js' type='text/javascript'/>
    <link href='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/plugins/line-numbers/prism-line-numbers.min.css' rel='stylesheet'/>
    <script src='https://cdnjs.cloudflare.com/ajax/libs/prism/1.5.1/plugins/line-numbers/prism-line-numbers.min.js' type='text/javascript'/>
  </head>

To show how to use PrismJS, we're going to use a simple Hello World example written in HTML. First, ensure that the Post settings > Options > Compose mode is set to Show HTML literally, otherwise it will screw up the page formatting.


Paste the following code to the editing area, this will escape the strings automatically when composing in HTML mode.
<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

Switch to HTML mode using the button located at the top left of the page. Locate and enclose the escaped strings using the <pre> and <code> tags like the one below:
<pre class="language-markup line-numbers"><code>&lt;!DOCTYPE html&gt;<br />
&lt;html&gt;<br />
&nbsp; &lt;head&gt;<br />
&nbsp; &nbsp; &lt;link rel="stylesheet" href="style.css"&gt;<br />
&nbsp; &nbsp; &lt;script src="script.js"&gt;&lt;/script&gt;<br />
&nbsp; &lt;/head&gt;<br />
&nbsp; &lt;body&gt;<br />
&nbsp; &nbsp; &lt;h1&gt;Hello World!&lt;/h1&gt;<br />
&nbsp; &lt;/body&gt;<br />
&lt;/html&></code><pre>

It should produce the following output:
<!DOCTYPE html>
<html>
  <head>
    <link rel="stylesheet" href="style.css">
    <script src="script.js"></script>
  </head>
  <body>
    <h1>Hello World!</h1>
  </body>
</html>

To add syntax highlighting to other languages not supported by the default prism.min.js, head over to CDNJS website and find CDNJS script file for the language that you need. In order to use that script file, you can visit the PrismJS here to know the naming convention for that language.




If this post helped you to use PrismJS syntax highlighting to your Blogger page, please let me know by posting a comment below.

Now back to coding...