Category: Programming

Code, JavaScript, Problem Solving, Programming, Software

Lean Code and JavaScript

As I’ve said many times before, “There’s always a better way and more than one solution!”  The sentiments of this statement are echoed by the many ways a solution can be programmed using any of the many available languages including JavaScript.

Although I’ve been working with JavaScript for a number of years, I continue to discover interesting nuances in the language.  The learning never stops and is an inherent part of the intrigue that is programming.

While many solutions exist, some techniques and methods of programming are preferred over others.  Once you’ve mastered the basics of JavaScript, the programming challenges you are prepared to accept will inevitably become more complex.

Learning to address various coding problems is directly dependent on the knowledge and tools with which you are already familiar.  Be reminded however that just because they work doesn’t mean they are as effective or as efficient as they could be.

On this premise, I consider programming as a learning continuum.  Books and videos tend to serve as my primary sources of learning and reference.  In the case of JavaScript, one such book is:

Effective JavaScript presents detailed examples of what NOT to do and why followed by effective solutions to resolve the concerns identified.  The examples are succinct and clearly demonstrate complex ideologies in a simple, straightforward manner.  I have learned more from this book than most could begin to offer.

Learning how to code is only one aspect of programming.  Understanding how your code (or the language) works and why is another.  Effective JavaScript does both with a greater emphasis on the latter.  You will save yourself many hours of debugging your code when you have a clear understanding of what JavaScript can do when used correctly.

Of course, there is always Google, however, the information is typically solution oriented without the full benefit of scope or context.  As I’ve said before, “Be careful who teaches you.”  Unless you understand the code you are using, resorting to a “searched” solution may be cause for more trouble than it’s worth.

Until Next Time – STAY lean!

Versalytics

Related Articles and Resources

 

Advertisements
APIs, Code, CSS, GUI, HTML, JavaScript, Programming, SVG, WebGL

What? Rats WebGL Hit a Snag?

When your code hits a snag, there has to be a solution.  If you’ve discovered the “Rats WebGL Hit a Snag” notification, here are some articles we’ve discovered to both enlighten you and provide potential fixes.

It’s important to be aware of the potential problems your application may encounter, especially those that are beyond your control.  In this same respect, it is important to consider the tools and/or API’s you choose to use in your application.

Simply an FYI …

 

Until Next Time, STAY lean!

Versalytics

Code, CSS, GUI, HTML, JavaScript, Programming, Responsive, Software, SVG, Website, XML

Lean Code – Web Graphics

Graphics and Animation

MultipleMachines

Over the past few weeks, I’ve been working on an application to simulate multiple production processes working in tandem and decided to re-introduce myself to the world of animation.  In its present state, the application is working quite well using just the core HTML5, CSS3, and JavaScript web languages.

The HTML5 canvas makes it easy to render graphics where CSS3 and JavaScript are used to manage and manipulate various animation effects.  Aside from the canvas element, OpenGL, WebGL / WebGL 2.0, SVG (Scalable Vector Graphics) and SMIL (Synchronized Multimedia Integration Language) or VML (Vector Markup Language) are also options to render graphics to your web page.

While HTML canvas is relatively easy to understand, working with SVG can be a little more complicated.  Fortunately, a number of packages exist that can be used to create our shapes and several JavaScript libraries are available to work with the generated SVG files.

Creating Vector Graphics

Adobe Illustrator is a great product but also demands a monthly subscription fee which, unless you’re a professional web developer, isn’t something too many of us want to add to our monthly budget.

An SVG Editor (by henoc) is available for Microsoft’s Visual Studio Code that can simplify the task of working with SVG.  You may also wish to consider using:

  • Vectr, a free cross-platform vector graphics editor, that allows you to create scalable vector graphics in 2D.   You can use the online version or download a copy of the application for your operating system (Windows, Mac, Linux, or Chromebook).
  • Inkscape a professional vector graphics editor for Windows, Mac OSx and Linux.  Free and open source.
  • Gravit Designer is a very capable and powerful design tool.  You can use the online version or download a copy of the application for your platform (Mac OSx, Windows, Linux, and Chrome OS).
  • There are also a number of online SVG editors – easily found with a simple Google search –  where you can create simple 2D SVG files online and save them locally to your machine.
  • It is also worth noting that the WebStorm IDE by JetBrains, our IDE of choice for web-based applications, also provides a level of support for working with SVG files.

JavaScript Libraries for SVG

While we can manipulate and work with SVG data directly using CSS and native JavaScript, a number of libraries are available that provide significantly enhanced functionality and effects.  Some commonly used libraries for working with SVG data include:

JavaScript libraries will save you a tremendous amount of time and effort so you can focus on your application.  It is also possible to render 3D models using SVG with more highly capable JavaScript libraries.

Browser Support and Local Files

Browsers provide varying degrees of support for today’s web technologies and knowing what is or is not supported will determine whether your application will run as intended.  IE (Internet Explorer) is one browser that is typically lacking in support for capabilities such as CSS transforms on SVG elements.

Remember:  Browsers are NOT created equal.

FailedtoLoad-CrossOriginRequests

Some browsers like Chrome do not permit access to files or data on your local drive and you may receive an error similar to the one pictured above if you make the attempt.  Fortunately, I’m using the WebStorm IDE by JetBrains and have the option to run code either as a local file or using the built-in server.

Use a local server if you are using Chrome or another browser that does not provide access to data files that are local to your machine.

Responsive Websites

A responsive website is one of the more significant and noteworthy advantages of using SVG for your graphic elements.  Scaling your site to accommodate devices of all shapes and sizes is less of a challenge with SVG.   Images retain their original quality regardless of scale, can be created or edited with any text editor, and can be manipulated or enhanced using CSS and JavaScript.  These reasons alone make learning SVG that much more rewarding for you and your visitors.

The options for animating your website are many and limited only by your imagination.  As I’ve said many times before, “There’s always a better way and more one solution.”  Working with SVG’s and the number of API’s available to animate them proves this statement to be true yet again.

Until Next Time – STAY lean!

Versalytics

Related Articles and Resources:

 

 

Apps, Computers, Programming, Software, SQL, SQLite, Tcl/Tkinter

SQLite Security And SQLCipher

SQLite is a light weight relational database management system (RDBMS) that is used by many applications.  Unfortunately, your data is not secure and can be read by anyone who has access to your SQLite database.

TCL (Tool Command Language) makes writing SQLite database applications a relatively simple chore where I can focus more so on the application itself.  For this reason and that SQLite is freely available and highly supported, I often prefer to use an SQLite database solution.

Although Microsoft’s SQL Server is typically our RDBMS of choice, having a secure database could well extend where SQLite can be deployed for more data sensitive applications.

Data Security Solutions

The SQLite site offers several Professional Support and Extension Products.  For a nominal one time fee you can purchase a license for the SQLite Encryption Extension that provides the added ability to read / write AES-encrypted databases.

Additional licensing options are available and include the “Compressed and Encrypted Only Database (CEROD)” license to read encrypted and compressed databases and the “ZIPVFS Read/Write Compressed Database Extension” license to automatically compress and encrypt data as it is written and decompress data and decrypt data as it is read.

The above options require a significant financial commitment, however, SQLCipher by Zetetic LLC provides a level of security that may give you cause to consider using SQLite for some of your more sensitive and smaller scale applications for a much lower (or free) price.

SQLCipher offers a variety of paid licensing options, however, according to the Open Source web page:  “SQLCipher Community Edition can be used in both open and closed source commercial software, but you must include our BSD-style license and copyright statements prominently in the application and documentation.

SQLite is one of many database options available to you as a developer.  Use your discretion when choosing which tools will best support and meet the requirements demanded by your application.

Until Next Time – STAY lean!

Versalytics

Related Articles and Resources

SQLite Web Security – SQLite.org

SQLCipher Extension for SQLite – GitHub – Latest release 3.4.2 – December, 2017.

How to Compile And Use SEE – SQLite.org

 

APIs, Apps, Code, JavaScript, Programming, Python, Software

Lean Code and API’s

API Resources

GeocodeResponse-OVER_QUERY_LIMIT

Using an Application Program Interface or API is not a new concept, is relatively simple, and easy to do.  However, developing applications using resources outside of your local controlled environment can present new challenges and opportunities.

In this instance, I was testing one of Google’s API resources and received an “OVER_QUERY_LIMIT” error message.  Although it’s not too often that this happens, apparently it can on occasion.

You have exceeded your daily request for this API.  We recommend registering for a key at the Google Developers Console:  https://console.developers.google.com/apis/credentials?project=

You typically need an API key before you can use an API such as the Google Maps Geocoding API.  For those of you thinking or wondering about security, you can place restrictions on the use of your API key.

Registering an API Key

APIs Credentials

If you already have a Google account, go to the “https://console.developers.google.com/apis/credentials?project=” link as shown in the error message above, sign in to your account and accept the terms and conditions.  You can then begin the process of creating your project and credentials.  Google will then generate an API key for your project to use in your application.

As of this writing, there are at least 184 API’s available where some of the more popular API’s include Google Drive API, Gmail API, Google Maps Android API, Google Cloud Translation API, and Google Maps Geocoding API.

Once you’ve enabled the API’s required for your project and set up your API Key, you can begin using and monitoring the services requested from your GoogleAPIs dashboard. The “Web Services > Geocoding API” page provides a simple example of getting and using the API Key in your application.

API’s can greatly simplify your application development and enables you to deploy features that would otherwise consume a lot of time and effort to implement.  The guides and documents in the API Library describe the scope of the API and provide sufficient information to begin using them to your advantage.

API Access Limits

Be aware that some API’s may have limits to the number of free “access requests” received and/or processed in a given day or over a given time period.  Users may encounter problems if requests from your site exceed this limit.  Increased access requests may be available if you are using a “fee-based” service or premium account.

For example, as of this writing, the Google Maps Geocoding API imposes the following Standard Usage Limits:  2,500 free requests per day and 50 requests per second.  A “pay-as-you-go” billing option or Premium Plan is also available with a maximum of 100,000 daily requests.

API Services

API services or resources may offer significant advantages for your application and are certainly worth an investment of your time to see what is available.  If your programming language, such as JavaScript or Python, provides a means of working with “http” requests, API’s are definitely worthy of your consideration.

API’s enable working with external resources both as a data source and for manipulating data.  The ability to programmatically work with data reduces the possibility of data entry errors and other human fallibilities.

Remember to use API key restrictions to control and prevent unauthorized access requests!  Making an attempt to use an API key from a site other than the one authorized in the restriction settings will return a “REQUEST_DENIED” status as pictured below:

API-Restricted-Access

Until Next Time – STAY lean!

Versalytics

Code, Editors, JavaScript, Programming

Brackets Update

Brackets-Corner-ScreenShotVersion 1.12 of Brackets was released on January 29, 2018 and is now available for download.  This release introduces some exciting new features including JavaScript Refactoring, intelligent rename in file/scope feature, try catch block wrapping, one click conversion of anonymous expression / function block to arrow expression, and getter/setter creation.  More information can also be found in the release notes.

As a lightweight editor, Brackets serves as the “Goldilocks” solution for my smaller JavaScript and web page development projects.  Web page development is greatly enhanced with the live preview feature.

Although JetBrains Web Storm is my IDE of choice for larger applications, Brackets is an ideal editor for those looking to start off with something simple and easy to use.  Numerous extensions are readily available, easy to install, and will greatly enhance your experience while using Brackets.

To take advantage of the latest and greatest features, it’s important to keep your applications up to date.  These updates may fix bugs that you’ve discovered (or have yet to discover) and may also introduce some features that can save you a lot of time and effort in your development process.

Until Next time – STAY lean!

Versalytics

 

 

 

 

Code, Computers, Editors, IDE, JavaScript, Productivity, Programming

Lean Code and JavaScript IDE

BracketsJavascript is one of the more popular programming languages in use today and its use and capabilities are further enhanced by a variety of available frameworks, such as Node.js and AngularJS, and other libraries.

Although you can use almost any text editor to write Javascript, a language based Interactive Development Environment (IDE) or Code Editor can greatly improve your ability to write code more efficiently and effectively.  This is especially true where syntax and case sensitive languages – like Javascript – are concerned.

I use WebStorm by JetBrains for the majority of my web-based applications, however, a number of less capable cross-platform IDE’s and editors are also available for writing JavaScript, HTML, and CSS.  One such editor is Brackets created by Adobe Systems.

“Review:  The 10 best JavaScript editors” by Martin Heller, Contributing Editor, InfoWorld (May 17, 2017) presents a number of JavaScript editors for consideration of which Brackets is among them.  I prefer to use cross-platform tools wherever possible and I use a variety of IDE’s and editors that are best suited for the project at hand.

Brackets is a light-weight open-source cross-platform editor equipped with sufficient functionality to efficiently write HTML, CSS, and JavaScript code.  A number of extensions are also available to further enhance your experience using Brackets.

Extensions are often written by third-party programmers or developers and should be installed with caution.  I highly recommend researching and reading reviews by others to ensure they are worthwhile and trustworthy.

If you are just learning JavaScript or writing a quick a script, consider the simplicity of using an editor like Brackets where you can focus on writing your code rather than get bogged down with learning all the details and nuances of a full-featured IDE.

If you’re wondering what kind of programs can be written using JavaScript, HTML, and CSS, you’ll have Brackets to serve as your source of inspiration as one of the many possibilities.  For more information, visit the Brackets web page.  As of this writing, Brackets 1.11 is available for download.

The excitement of learning a new language is often met with varying degrees of chaos and confusion when selecting the right tools to get started.  I recommend starting with something simple and less distracting that will allow you to focus on the task at hand.  Brackets is one such editor.

In time, you will learn which tools will best serve your needs and you can adjust your working and coding environment accordingly.  Feature filled IDE’s and Editors will do little to serve your needs if you have yet to learn or don’t know how to program.

Until Next Time – STAY lean!

Versalytics

Related Articles, Resources, and References