Daniel Andrukonis

Web developer

Happy easter!

Key calendar dates;

 

Good Friday 14th of April

Easter Sunday 16th of April

Easter Monday 17th of April

 

 

A soul which plays with old lady feelings should be scary and funny at the same time. However, for some reason it reminds Adams family.

 

Enjoy!

Monthly revision

Many actions happened during a month. As a result, we should start from previous article which was named as a Job Search. In that story we will find a huge list of the websites which should be updated today.

The list is following;

Graduates

  1. www.eurograduate.com (not registered yet)
  2. www.graduate-recruitment.com (not registered yet)
  3. www.graduatesbase.com (not registered yet)
  4. www.milkround.co.uk (not registered yet)
  5. www.prospects.ac.uk (registered)
  6. www.topgrads.co.uk (not registered yet)
  7. www.apprenticeship.org (not registered yet)

IT and Technical

  1. www.apple.com (not registered yet)
  2. www.computerweekly.co.uk (not registered yet)
  3. www.cvstore.net (not registered yet)
  4. www.cwjobs.co.uk (registered)
  5. www.executives-direct.com (not registered yet)
  6. www.jobmagic.net (not registered yet)
  7. www.jobserve.com (not registered yet)
  8. www.majorplayers.co.uk (not registered yet)
  9. www.microsoft.com/jobs/ (not registered yet)
  10. www.netjobs.co.uk (not registered yet)
  11. www.rda.uk.com (not registered yet)
  12. www.staff4hire.com (not registered yet)

IT

  1. www.theitjobboard.com (not registered yet)
  2. www.mcsgroup.jobs/ (not registered yet)
  3. www.computing.co.uk/jobs (not registered yet)
  4. www.computerweekly.com/jobs (not registered yet)

Office

  1. www.office-angels.com/en-GB/Pages/default.aspx (not registered yet)
  2. www.officerecruit.com/ (not registered yet)
  3. www.simplyofficejobs.co.uk (not registered yet)

Self Employment

  1. www.businesslink.gov.uk (not registered yet)
  2. www.hmrc.gov.uk (webinar)

Main website for job search has provided strange output for the first time for a long time.

Server error in application screenshot could be found  below;

 

As a result, we would not able to connect to the website and get the list of the month activities. An error have not changed even we have had restarted all the services. In consequence we will update it manually from the memory. The updated list following;

Graduates

  1. www.eurograduate.com (not registered yet)
  2. www.graduate-recruitment.com (not registered yet)
  3. www.graduatesbase.com (not registered yet)
  4. www.milkround.co.uk (not registered yet)
  5. www.prospects.ac.uk (registered)
  6. www.topgrads.co.uk (not registered yet)
  7. www.apprenticeship.org (not registered yet)

IT and Technical

  1. www.apple.com (registered)
  2. www.computerweekly.co.uk (not registered yet)
  3. www.cvstore.net (not registered yet)
  4. www.cwjobs.co.uk (registered)
  5. www.executives-direct.com (not registered yet)
  6. www.jobmagic.net (not registered yet)
  7. www.jobserve.com (not registered yet)
  8. www.majorplayers.co.uk (not registered yet)
  9. www.microsoft.com/jobs/ (not registered yet)
  10. www.netjobs.co.uk (not registered yet)
  11. www.rda.uk.com (not registered yet)
  12. www.staff4hire.com (not registered yet)

IT

  1. www.theitjobboard.com (not registered yet)
  2. www.mcsgroup.jobs/ (not registered yet)
  3. www.computing.co.uk/jobs (not registered yet)
  4. www.computerweekly.com/jobs (not registered yet)

Office

  1. www.office-angels.com/en-GB/Pages/default.aspx (not registered yet)
  2. www.officerecruit.com/ (not registered yet)
  3. www.simplyofficejobs.co.uk (not registered yet)

Self Employment

  1. www.businesslink.gov.uk (not registered yet)
  2. www.hmrc.gov.uk (webinar)

Strangely, only one website has been remembered from the memory in the list. The name of the website is (http://www.apple.com/jobs/us/index.html).

For some reason, I would like to mentioned about Angular which is a framework. One of the month experiences was a meet up in the conference how to migrate from Angular 1 to Angular 2 this conference left a huge impression.

During that conference we were introduced to the JavaScript language complexity and power.  The resources, also, has been provided the name of the documentation is saved in iPhone iBooks “Angular-2-from-theory-to-practise-v1.0.1”. As it was very hard to find one of the decisions was to send an email to myself and upload the documentation to this host which would be available for future.

In the following link it should be available for everyone angular-2-from-theory-to-practice-v1.0.1.

The author of the documentation Asim Hussain have had a presentation at the time. The documentation contains more than 600 pages, therefore, it was hilarious that sometimes we think that it is possible to write such as documentation in one day. Despite the fact the world is full of magic, therefore, the picture of the front page documentation may think that it would be possible if the algorithm would be written in such a way that when human sleep machine could do the job for him. I would suggest to try at least one task in the plunker editor just to try understand the way it works.

Personally I have tried to read and do some exercises, nevertheless, most of the time is a time consuming task.

Last talk he provided on 6th of April.

It’s only an hour long and provides a tutorial how to migrate from Angular 1 to Angular 4. The work shop could be found in the GitHub which is very famous way of storing and sharing information between developers.

If it would not work follow the readme.md documentation which is available from GitHub.

The main problem was to start a server as it would provide a picture with many details errors and warnings. One of the examples are attached below;

As we can see the information provided in the picture could confuse or make you start thinking on how we actually could start a server.

As we have had enough experience with terminal now Job Search activity for a month available from government website.

Application history

Registered websites

https://www.jobsite.co.uk (registered)

https://www.reed.co.uk/ (registered)

https://www.technojobs.co.uk (registered)

https://jobs.theguardian.com (registered)

https://www.monster.co.uk/ (registered)

https://www.totaljobs.com (registered)

https://www.jobs4.co.uk (registered)

http://www.cvbrowser.com/ (registered)

https://www.cwjobs.co.uk (registered)

https://jobbio.com (registered)

http://www.jobg8.com (registered)

After all of this I will add to myself 1% to AngularJS and JavaScript skill set bars.

That’s all for now. It’s time for rest.

SASS + (Bootstrap / Foundation)

Recently I have found out about css-tricks where we could find many helpful articles with advice which leads to new terminology, such as, Syntactically Awesome StyleSheets (SASS).

CSS-Tricks launched July 4th, 2007. It used to be, believe it or not, primarily about CSS! Over the years, CSS-Tricks has come to become a site about all things web design and development.

As a result, I have decided to write a blog which would introduce to SASS.

How to install?

For full instructions go to the following website, however, if you prefer the command line over an application and you are MAC user you could follow this instructions;

 

  • Open your Terminal On the Mac the Terminal.app comes installed by default.
  • Install Sass. Ruby uses Gems to manage its various packages of code like Sass. In your open terminal window type:
    gem install sass

    This will install Sass and any dependencies for you. It’s pretty magical. If you get an error message then it’s likely you will need to use the sudo  or su command to install the Sass gem. It would look like:

    sudo gem install sass
    

  • Double-check. You should now have Sass installed, but it never hurts to double-check. In your terminal application you can type:
    sass -v

    It should return Sass 3.4.22 (Selective Steve). Congratulations! You’ve successfully installed Sass.

 

After successful instalation in order to undestand how does that function I came across Foundation responsive framework. Apparently, it is most advanced responsive framework. However, there is another known framework which acomplish the same functionality named Bootstrap. As a result, the first question in mind comes which should we use?

 

According to Laurence Bradford article it is actually up to us what we use. Just due to curiousity I will compare several figures and update comparision table.

 BootstrapFoundation
Websitehttp://getbootstrap.com/http://foundation.zurb.com/
Version3.3.76.3.0
Date of last release26 Jul 201615 Dec 2016
Stars on Github107,000+25,000+
Tagged questions on Stack Overflow76,000+4,300+
Browser supportsupports the latest, stable releases of all major browsers and platforms. On Windows, we support Internet Explorer 10-11 / Microsoft EdgeChrome, Firefox, Safari, Opera, Mobile Safari, IE Mobile, IE 9+, Android 2.3+
Sizing unitsPixelsRems
LESSYESNO
Sass/scssYESYES
File size370KB206KB
 Note that all information based on time of writing, February 2017.

In conclusion, according to the most up to date table we could state that bootstrap is more in use nowadays, however, it does not mean that it’s better. If we look at the number of questions asked in stackoverflaw we could state that it would be easier to learn as it provides more information or other way around it could be more harder to learn as it brings more complexity. In effect of education purposes I will try to get dirty with foundation-sites projects as it’s already been downloaded and play around. If it won’t make me happy I will come back to bootstrap.

WordPress update + first steps in AWS + Symfony

Today the main aim is to introduce relevant activities which involved in the past several days. Firstly, I would like to mention that one of the main actions was to apply for jobs which lead to a new framework explorations. Therefore, let’s begin by introducing the activities which were executed.

  • WordPress update
  • First steps in Amazon web services
  • Symfony setup

WordPress update

After updating WordPress platform and theme to 2.7.2 it actually has changed and I have had to put more effort on how to customise it back to as it was before. Without backups it would be even more harder, however, thankfully they were made before the update.

First steps in Amazon web services

In one of the job requirements it was stated that AWS skill required. As a consequence of, this I have decided to learn myself.

  • Three buckets were created
  • Permissions added

  • Static Website Hosting enabled, files uploaded

PHP Symfony framework

Today, I have applied for the PHP Symfony Developer role. As a result, I have decided to install the framework in order prepare for technical side evidence.

  1. Symfony installation

The picture above explains that we before starting a new project we have to fix date.timezone issue. Because of, this error it would not able to run properly. In meanwhile I have decided to find php.ini file which would target etc/php.ini file.

 

https://symfony.com/doc/current/setup.html
http://symfony.com/doc/2.8/page_creation.html

 

Angular + ChartJS

The main idea today was to recap JavaScript and show hilarious difference between the first understanding of d3.js and chart.js . According to stack overflow community d3.js is not a chartable library it is a library for creating and manipulating SVG/HTML. It provides tools to help visualize and manipulate your data. The main differences between Canvas and SVG;

Canvas

  • Resolution dependent
  • No support for event handlers
  • Poor text rendering capabilities
  • Well suited for graphic-intensive games

SVG

  • Resolution independent
  • Support for event handlers
  • Best suited for applications with large rendering areas (Google Maps)
  • Slow rendering if complex (anything that uses the DOM a lot will be slow)

 

Ironically, when I first tried to install and use Angular + Browsersync + D3 it would provide static bar chat output. In contrast to Angular + Chart.JS it would provide more effects which could lead to debate and research which would introduce more complexity and fun. Due to the sake of this article let’s start scratch.

Plan of experiment Angular + Chart.JS

0: Terminal + Github + Angular-seed

Due to the “scratch” terminology in use I have decided to make a screenshot which would show all available projects in local machine for this exercise purpose. However, in terms of scratch and many other applications I have decided to set up on a new user in local machine which would mean that different modules and components are already installed. Even though, I have been trying to follow the documentations and use instructions provided by GitHub community. Illustrations A and B below will deliver a better view why sometimes it’s better to keep machine tidy.

Illustration A (main workspace)

Screenshot 2017-02-10 18.12.29

Illustration B (new)

Screen Shot 2017-02-11 at 03.36.26

1: Configuration + setup

 Screen Shot 2017-02-11 at 01.03.17

 

Main files and folders are highlighted in the following picture. It won’t work without lines 18 and 19. To double check;

Code

Screen Shot 2017-02-11 at 03.55.54

If we edit 18 and 19 lines the output

Screen Shot 2017-02-11 at 04.06.50

If we leave both lines as in Code screenshot

Screen Shot 2017-02-11 at 04.08.19

 

Time to have a rest.

 

 

 

HTML + PHP revision

As I have received a call from cyber team and have been asked what is my skills on PHP I have decided to test myself in w3schools quiz. As, a result in this article I will go through at least 40 questions on each module and if results output will be better that it is now I will update my SKILLS portfolio.

HTML Revision

Screenshot 2017-01-24 14.21.43

Wow 67% from first try isn’t that bad compare to current 52%. Due to this, I will have to edit php code in my blog which would increase HTML bar up to 67%.

Wrong answered questions are listed to improve the skill set for next time are following;

3. Choose the correct HTML element for the largest heading:

You answered:

<h6>

Wrong Answer!

12. Inline elements are normally displayed without starting a new line.

You answered:

False

Wrong Answer!

13. How can you make a numbered list?

You answered:

<list>

Wrong Answer!

16. What is the correct HTML for making a text input field?

You answered:

<input type=”textfield”>

Wrong Answer!

17. What is the correct HTML for making a drop-down list?

You answered:

<input type=”dropdown”>

Wrong Answer!

18. What is the correct HTML for making a text area?

You answered:

<input type=”textarea”>

Wrong Answer!

20. What is the correct HTML for inserting a background image?

You answered:

<body bg=”background.gif”>

Wrong Answer!

25. Which HTML attribute specifies an alternate text for an image, if the image cannot be displayed?

You answered:

src

Wrong Answer!

26. Which doctype is correct for HTML5?

You answered:

<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 5.0//EN” “http://www.w3.org/TR/html5/strict.dtd”>

Wrong Answer!

33. Graphics defined by SVG is in which format?

You answered:

CSS

Wrong Answer!

36. Which input type defines a slider control?

You answered:

slider

Wrong Answer!

37. Which HTML element is used to display a scalar measurement within a range?

You answered:

<range>

Wrong Answer!

40. Which HTML element is used to specify a header for a document or section?

You answered:

<head>

Wrong Answer!

 

PHP Revision

Screenshot 2017-01-24 15.14.48

Well done compared to previous knowledge. After this accomplishment the percentage will slightly enlarge. In effect of revision the bar chart skill set in PHP will increase from 51% to 84%.

For future improvements following wrong answered questions should be revised.

 

2. PHP server scripts are surrounded by delimiters, which?

You answered:

<script>…</script>

Wrong Answer!

 

6. The PHP syntax is most similar to:

You answered:

JavaScript

Wrong Answer!

 

17. What is a correct way to add a comment in PHP?

You answered:

*\…\*

Wrong Answer!

 

25. Which operator is used to check if two values are equal and of same data type?

You answered:

=

Wrong Answer!

Angular + Browsersync + D3

Today I have been trying to get around and try to understand how D3 library visualisations work with server.
Apparently, Angular is very useful due to it’s support as it been designed for creating web-apps. In addition, it supports very famous Model View Control (MVC) approach. Due to this, the main idea was to start a server and understand how to join D3 library which would lead to inspired output. As result of previous exercises.

Starting Angular

Screenshot 2017-01-13 16.31.24

localhost:3000 Browser Output

Screenshot 2017-01-13 16.32.31

Front End Control of Browsersync

Screenshot 2017-01-13 16.34.27

 

First impression is that we can see the output of the lite-server which actually provides huge amount of information. From general sense it allows for admins to follow the links which would direct to the scripting codes. As we know all fun begins when we are trying to change the code and manipulate the browser output.

Basic chart

Screenshot 2017-01-13 16.46.12

Starting Angular script
Screenshot 2017-01-13 16.49.18

For more inspiration the following link should be used for exploration.

Introduction to NodeJS

NodeJs is known as server-side platform built on Google Chrome’s JavaScript Engine. It has been developed by Ryan Dahl in 2009. The official website contains much more information about improvements etc. Personally, I have used tutorialspoint which helped me to understand the basics behind the wheel. My aim today is to cover up my operations which helped me understand how simple server side client could be created in localhost which would have some basic login form communications. I will skip original installations, however, sometimes I will try to run an update which would show the current version on local machine.

Simple commands;
npm update express
npm start
Screenshot 2017-01-10 18.03.06

As we can see npm start output have provided the current version of node and npm which means that those modules exist.

ls -l
Screenshot 2017-01-10 18.08.38

node server.js
Screenshot 2017-01-10 18.10.48

Even though, we have receiving errors when we try to run a type http://localhost:8081 in our Chrome browser we receive the following output.

Screenshot 2017-01-10 18.12.58

The server.js code output is following;

Screenshot 2017-01-10 18.16.18

 

Now let’s try to run another script which would listen on other port in this case because 8080 already in use.

Screenshot 2017-01-10 18.28.14

node server2.js
Screenshot 2017-01-10 18.30.03

As the result we are able to get the output from the browser as following;

Screenshot 2017-01-10 18.35.07

However, this browser and script is not powerful enough as it not able to upload a picture.

Screenshot 2017-01-10 18.36.36

In this case we should find and write a code which would make it possible. As current server have been configured to run simple JSON input output it would be good to show it functionality and then come back to file upload basics.

To make it clear I have edited and created two new files index3.htm and server8.js. As a result I will try to open new terminal and first execute server8.js and then will try to open browser.

1. Open a new terminal and follow the screenshot below

Screenshot 2017-01-10 19.00.22

node server8.js
Screenshot 2017-01-10 19.08.39

2. Type localhost:8083/index3.htm in browser as following;

Screenshot 2017-01-10 19.00.53

index3.htm
Screenshot 2017-01-10 19.10.56

The final output
Screenshot 2017-01-10 19.01.40

The interesting thing is that as we submit name and surname we receive same output in terminal console which means server receives browsers input.

Job role

At the moment I have got a temporary job with data input at the University. This role allows me to get basic office skills, such as, paper scanning, documents edit, emails, phone calls, spreadsheets, SITS (a student records management system used to store, administer and manage all aspects of student information from initial enquiry and application through to Degree Congregation), etc.

Due to specific rules, I am not allowed to disclose any more information, because of the content and agreement between me and University.

Originally, this work placement meant to be only for two weeks, nevertheless,  it will be extended, because of the workload we have received. As soon as this work finish, my aim will be to write an article about the new job search strategy which would increase encouragement to find related position.

Learn Git

As most developers nowadays should now how to use GitHub I have decided to take free course in codecademy which covers the following topics;

  • Basic Git Workflow
  • How to backtrack in Git
  • Git Branching
  • Git Teamwork

As a consequence, of spending several hours I have managed complete 50% of course which reminds basic operations. The first two topics was easy to approach, forums with discussions reviews started in Git Branching. For example, when we create a new branch “fencing”  it would have some issues to change to masters’ division.

 

Screenshot 2016-09-16 10.46.06

As we type “git checkout master”

Screenshot 2016-09-16 10.48.11

System asks as to commit our changes or stash them before we can switch branches. Due to this I will try to commit resume.txt.

Screenshot 2016-09-16 10.57.10

As we can see on the screenshot above it modified, so logically, it should allow us to change to Masters class, however, for some reason it won’t.

Screenshot 2016-09-16 10.46.24

As a result, more research should be done, even though, on different website, such as, Try Git it worked without any errors. In respect of the error the problem now has been found. It would not change due to simple command “add resume.txt”.

Screenshot 2016-09-16 11.05.25

In conclusion, even one small line or even one symbol such curly brackets would affect the code.