In order to build a reputation as a software developer consistent blog posts are essential to build an identity. This is the main reason I have started jsdiaries.
Although I have to admit, this is something that I originally couldn’t comprehend. How will building a blog boost my career in software development? Well providing useful information not only benefits readers of your blog but also gives the blogger the opportunity to learn by teaching. The more content researched the more likely it is that you have learned more and built a stronger brand in the process.
This plan I have created for jsdiaries came from following John Somez’sHow to Create a Blog to Boost Your Career course.
His email course provides the stepping stones for a developer to create a blog like this. His course takes place over 3 weeks and an email with information on how to create a blog for software development is sent every Monday and Thursday. If you want to sign up just click below.
The emails are very direct and concise on how to create a platform like this to build a brand and identity. The most impressive byproduct of this course is that software developers that are in the exact same position with their blog can network together and support the growth of each other. John has enabled this by featuring all the bloggers that finish his email course on his website Simple Programmer linked below.
Its a simple but effective way of boosting his own reputation while simultaneously helping to grow the careers of other developers.
In the last year Visual Studio Code has been constantly improving and its becoming more renown in the software development community. Coming from someone who originally used Sublime I now only use Visual Studio Code ,this is mainly because of a more diverse implementation of its own Intellisense features for languages such as TypeScript (which is is also what Visual Studio Code is written in) .
By pressing Ctrl+Space we are able to we access a huge list of member accessors/methods that you would otherwise not be aware of or that you might have to look up.
This saves you time and shows you description/explanation of the parameters or method accessers without disengaging you from your work environment. Some Intellisense features are not included in Visual Studio by default.
Although Visual Studio Code supports most languages out of the box you can usually find your desired language by searching for it in the extensions tab and then finding the support link on their detail page.
In comparison to other text editors such as Sublime, Brackets and Atom, Visual Studio Code has brought some core functionality from its full IDE counterpart. It brings much of this useful functionality and removes some of the more obscure features that would go unused by most day to day developers.
It is also available on Mac and Linux so non Windows users are now able incorporate a stripped down version of Visual Studio in their operating system. Lets run through some of these features included in the most recent version as of the publishing date of this post. The Microsoft devs are also kind enough to give us new monthly versions of Visual Studio Code with new features every month or so.
Syntax and Appearance
If you are looking for a font with a bit more pop in Visual Studio Code you could do worse than:
This add on gives your dev environment some pretty nice icons and symbols which enable your attractive code to be more attractive. It’s a win–win situation.
On a more serious note this may in fact actually increase your productivity, if your eyes are scanning across a code base, symbols and operators might stand out as more defined if they are in contrast to everything else beside it so this one is definitely worth a shot. On a more personal note I prefer the default VSC syntax highlighting over other editors such as Sublime.
I just think that every function, parameter, data annotation, keywords etc are suitably highlighted with an appropriate color, especially the dark theme. In contrast to this I thought the sublime color schemes were quite bright, neon and flashy although I was a big fan of the material design theme for it.
Visual Studio Code comes with full debugging support to view your code being compiled step by step or at certain specified breakpoints if you so choose. Go to the extensions tab and search for any debugging type extensions. These extensions can be specific to languages such as C# or Node.js.
When an extension like this installed VSC is given an debug adapter which defines a debug type. When debugging begins VSC looks up that adapter based on its type and launches the exe as a separate process. This is how the debugging begins.
To start the process we should navigate to the debugging tools by clicking the fourth option in our Visual Studio Code sidebar. This will bring you the debug screen like so:
By assigning a configuration and launch the debugging you should see your launch.json file. This contains all the attributes for your debugging session. You can also view which properties are available by using VSC Intellisense ctrl + space.
VSC has implemented a extensive but user friendly debugging interface. If you have any experience of debugging in its big brother IDE or have even just debugged with Java, C# in other environments they aren’t world apart. VSC debugging features highlight its rich array of options in comparison to other text editors.
At the moment I use VSC debugging capabilities to debug Typescript through VSC and Chrome for an Angular 2 application. For more information on debugging TypeScript check out this blog post from one of the Microsoft devs.
The ability to debug in a IDE like environment opens up a lot of opportunities for developers as previously using languages like C# in a text editor was unheard of because of the lack of debugging options. For more detailed instructions on debugging in Visual Studio Code check out the official documentation here: https://code.visualstudio.com/Docs/editor/debugging
Visual Studio Code allows you to link your Git repository with relative ease. It is the 3rd option in the user friendly navigation bar on the left hand side of the editor.
The button initializes the init () function Git command It will add all your files into your repository. As someone who is more used to using Visual Studio IDE’s team sharing services, having GIT implemented seamlessly into the user interface is incredibly useful and appreciated.
The notifications on what files are available to check in/commit to your local repository is an insightful tool-tip. You can later full push your changes to your GIT account from your local repository. By clicking the icon with the 3 small circle in a horizontal line we get access to full list of Git commands
If you have ever tried to use the snipping tools to capture a internal menu but it kept disappearing every time you clicked new than fear not. When you are trying to make some sort of documentation and have the snipping tool open just press CTRL + Fn + PrntScrn. This will activate the snipping tool and you capture your snip from there with the menu in screen. This is an old but relevant tip for the creation of any documentation or blog post. Kudos to Micheal Greene for reminding of this :
So these are some of the main points of Visual Studio Code that I thought I should share. I’ll be sure to cover each subsequent version released to see what new features are being implemented. But it is a fine looking editor both practically and aesthetically and I find my self more accustomed to this dev environment as I siphon through my code (Angular 2 / TypeScript at the moment). If you have any thoughts or contradictions where VSC falls compared to another editor be sure to mention it down below.
Angular Meetup is the first conference to be featured on this blog. It was a 2 hr Angular conference with four speakers. They discussed different features of Angular 2, highlighting the advancements from Angular 1, as well as some of its architectural patterns.
Angular Talks Meetup #6
Thursday, Nov 17, 2016, 6:15 PM
The Foundry, Google Barrow St Dublin, IE
271 ng-members Went
On the 17th of November, we would like to welcome you back at the Foundry in Google Headquarters for another great lineup of Angular talks.Join us for the latest Angular 2 news, tips and tricks from fellow industry experts, plenty of networking opportunities, plus the chance to win a free ticket for dotJS Conference, or a license for a JetBrains p…
Simona, an ambassador of the group Women Who Code, she discussed the components of Angular 2. She focused on Input and Output decorators, used for emitting signals in Angular 2 applications to detect changes. Because Angular 2 is a reactive framework, change detection is of huge importance.
The flow of data from top to bottom is another important characteristic of Angular 2. What I found most interesting is that an Angular 2 application will have a faster initial render because it is compiled at run time. Another word for this is “ahead-of time” compilation.
She also mentioned other helpful tools such as the Angular CLI. This helps to scaffold the application by generating components, directives etc. I am currently using this CLI in my Whiskey shop application. I find it incredibly useful that I can generate 3 or 4 files in one component from just one command “ng generate component_name”.
There are many other cool commands that help with boiler plating some other aspects of the application.
To finish, she recommended using Protractor for end-to-end testing in Angular 2. You can find that here. http://www.protractortest.org/#/
MVC is dead!
Fabrizio Fortunato – Lead Frontend Developer at Ryanair – @izifortune
Fabrizo addressed the differences in default two-way data-binding in Angular 1 and Angular 2.
It is inefficient to have constant callbacks from parent to child elements if no data needs to be reciprocated from parent to child elements. Instead, the child node can update a function that invokes methods based on the changed information.
The value of this is evident because the constant unnecessary callbacks in Angular 1 to parent elements hinder the application. This is because a one child element can be linked to multiple, ambiguous parent elements. Fabrizio also talked about how MVC is now on its way out regarding new emerging frameworks such as Angular 2.
The windowing technique
Danilo Castro – Software Engineer at Rapid7– @daniloster
Danilo’s talk was my personal favorite, maybe because I found the content most relatable.
He focused on a window technique where the window only displays data that is inside the constrains of a specified container size. He put the question to the audience – why would you bother rendering data in a window that is not being viewed?
I found this technique intriguing and seems like such a simple way to improve performance in an Angular 2 application. The view gets restricted and recycled. Danielo showed the math formula required to calculate the limited windows that are displaying this changing information. These calculations are invoked on a scroll event in Angular 2.
See his presentation on the windowing technique here.
Building Angular 2 (from MB’s to KB’s)
Thomas Horvath – Lead Frontend Developer at Xplosion Media –@criticalpix
Thomas presented how webpack can compile our Angular 2 files and compress them into a size suitable for a production environment. In his example, his output for the Angular 2 application was reduced from 2.5mb (an unsuitable size for a typical production environment) to 150kb.
This compression alone led to a significant reduction in the size of the application to be loaded in the network. Webpack also treeshakes your application to compress the size of the output. Thomas said that this is not fully functional for production environments. However when it does work, the reduction in size can reach as low as 150kb.
This event had the highest attendance of all the previous Dublin Angular events so far. I found it was very insightful to have four different perspectives on this new framework that is only really two months old.
While some of the techniques were more advanced than my current knowledge, I can see the advantages of implementing them in my Whiskey shop application, currently under development. I will be sure to feature this Whiskey shop on here soon, with the end-goal of making it open source. Please feel free to be critical of anything I post, factually or technically. It will help getting this blog off the ground long-term.
So feel free to level your criticisms at me akin to folks on webdev subreddit. 🙂