Programming With a Free API

What is an API? An application programming interface acts as an intermediary between your application and the API’s server. You request information from the server and it gives you information that you requested. When you get the data that you need, you can build a front-end design to display the information in a readable format.

Programming with a Free API
Photo by Flickr from Pexels

Find An API

You can use websites like Programmable Web, RapidAPI or API List. While you are evaluating APIs to use, consider whether or not you want to pay to use it. You can find free APIs for your projects.

Farmsense API

I found a free API on ProgrammableWeb called Farmsense. Farmsense provides three APIs to farmers: Day Lengths, Frost Dates and Moon Phases. I used the Moon Phases API to display the current phase of the moon.

Farmsense API Demo

Farmsense API uses the date to tell you what phase the moon is in, what percentage of full it is, how long the day is and more.

When I reviewed the AstroWidget, it shows way more information than I want. I wanted to display the current phase of the moon using HTML, JavaScript and CSS. First, I sketched out a design so that I would know what I wanted to build. Then, I read the API’s documentation. Farmsense API doesn’t require an API key. It does requires the current date.

I used JavaScript to get the current date and choose Milwaukee, WI as the location. Farmsense requires your location in longitude and latitude. To simplify, I decided to use one location.

Getting the Data From the API

How do you get data from the API? It returns the data in JSON. Instead of using the Astro-Widget’s method of retrieving the data, I used the JavaScript Fetch API to get it. The Fetch API made it simple and easy to retrieve the data and put it spots I wanted it.

The API doesn’t include images of the moon in each phase. I found icons of Moon Phases on Icons8. Then, I wrote a JavaScript function to determine the moon phase and displayed an icon image that closely matches the phase.

Screenshot of Moon Phase - Dec. 2, 2019

APIs let you work with data to create something more interesting. With HTML, CSS and JavaScript, you can create a simple user interface that retrieves data from an API. No database required for you to maintain. You can get start learning how to work with an API quickly. Have you built something fun with an API?

Make your site printable with CSS

Do your web pages look as good on paper as in your browser? When you are developing your website, you create it to look good on different devices. Then, you print it out and see how terrible it looks on paper. It prints everything out.

Make your site printable with css
Image by tookapic from Pixabay

What can you do to make it look good on paper too? You have to design for print as well. By using CSS, you can change your design to work on paper, too. The easy way is to add an additional media query for print to your CSS. Or you may want to separate it out into its own file.

What you need to create printable CSS?

  • Decide what elements need to be printed
  • Change your print styles to work with the printer
  • Adjust your design to be printable

Decide what needs to be printed

Websites have navigation bars, footers and other design elements that are necessary to use your site. When you are printing, you want only the content not the extras. To make a page printable, you need to decide which elements don’t have to be printed.

Change your print styles to work with the printer

When you print your page, you want it to fit on a page and not cut off important content in strange spots. If your page includes videos or iframes, you want to prevent them from printing as well. Sitepoint shows you how to create the perfect print stylesheet.

Adjust your design to be printable

What do you change? First, look at the font size. Is it too big? You may want to consider changing the size to fit better on paper. Next, are you using background colors on certain elements? You could change them to a different color or hide them.

Are you using a CSS Framework? The framework my impact how it looks on paper. For example, Bootstrap 3’s col-sm-* turns into a single column on paper. You want to change their settings so that the columns work they way you want on paper. Donnie Ray Jones explains how to fix Bootstrap 3 for printing.

By adding printable CSS to your site, you control how your page prints on paper. Your users will be happy it doesn’t print so many extra pages. It is easy to add to your website after you have finished developing.

Tips for Managing Productivity as a Developer

Do you manage your time or does it manage you? If you are like a lot of people, time manages you. As a developer, you need to handle distractions, projects and people. It can be difficult to manage distractions, maintain focus and get your work done.

Tips For Managing Productivity as a Developer
Image by 3209107 from Pixabay

How can you maintain your productivity? You can try these tips below to improve your focus and get things done.

Manage Interruptions and Distractions

You have to deal with distractions like Email, Social Media, notifications and more. Here’s a few things that you can try:

  • Decide when you are going to look at Email. You may want to look at email once or twice a day.
  • Mute all notifications from Slack and Social Media.
  • Put your phone away.
  • If you work in an office, close your door. Or put up a sign letting them know that you are working on a project and need to focus.

You don’t have to stay stuck on a problem

When you are coding, you can run into a problem that you can’t solve. No matter what you try it doesn’t fix it. When that happens, you can take a short break. Five to ten minutes away from the problem can really help. If a break doesn’t work, try working on something else. Doing something simple and easy can be the break that you need.

Create a library of code snippets

You’ll find yourself using the same snippet of code over and over again. Instead of searching your repos for it, you can create a library of snippets. By having a library, you can search and use those snippets faster.

Here’s a few ways to store your snippets:

  • Use a folder on your hard drive
  • If you write code in Visual Studio, you can collect code snippets with Code Snippets Manager
  • Use online tools like CodePen and Github.
  • CSS-Tricks has a collection of code snippets

Schedule and Take Breaks

When you are in the coding zone, you can forget to take breaks. If you try to push through a project without a break, you could burnout. To avoid forgetting, you can schedule your breaks. When you take a break and how long depends on which productivity method you prefer.

When you take a break, don’t start a new task. Take the time to get away from your computer. Stretch, walk, get some water or coffee.

Plan out your tasks

Why plan out your tasks? Planning helps you to know what you want to do and prevents you from forgetting things. You can use a to-do list, a bullet journal or an app like Trello to plan and track your tasks. Whatever method you use, it can help you get more done.

Pomodoro Techinque

When you have a long list of programming tasks, it can be hard to finish them and meet deadlines. The Pomodoro Techinque helps you to focus on one programming task at a time. The key is to work on one task for a specific time. You can use 25 or 50 minutes. When the time up, take a short break and repeat.

More Tips to Help You Program Better

Programming can be fun and challenging. Every programmer has their own list of tips, tricks and tools that help them solve problems and build things. Reading code, writing code, working with a team and taking breaks from coding all help you to improve your code. The collection below includes these tips and more.

More Tips For Programming Better
Photo by Kevin Ku on Unsplash

All my best programming tips

Jason Swett shares his best programming and debugging tips. He reminds you to work on one thing at a time, use clear names for things, don’t allow yourself to stay stuck and close unneeded tabs.

Top 5 tips to be a better programmer without programming!

You can become better at programming by focusing on your health and well being. Luke Garrigan talks about why you need to sleep, get moving, take breaks away from the computer and more.

10 Ways to Become a Better Developer

Whether you work on a team or as a freelance programmer, you need to work with or for others. Elizabeth at Praxent share her tips for being a better developer by embracing “teams”, how to say “no” to others, code for the future and make sure you do some coding for fun. Use it to explore ideas and problems that interest you.

10 Tips for Better Coding

Writing code can be difficult. You want to stay organized and embrace practices and process that help you write better code. In 10 Tips For Better Coding, Abdullah Abouzekry gives you tips that you can incorporate into your coding practice.

8 Ways to Become a Better Coder

Esther Schindler shares her eight actionable ways to become a better programmer. Her tips include how to read code, write code for fun, work with other developers and learn techinques instead of tools.

Whether you are a beginner or more experience programmer, sometimes you need to be reminded on what you can do to write better code.

Build Code With Accessibility

What is accessibility in web development? It means building websites that as many people as possible can use. Accessibility benefits everyone not only people with special needs. Have you tried to use your phone in outside in the side or with one hand? You may have given up or waited until later to do what you needed. If you have special needs, using an app or website can be a challenge. Accessibility means developing websites that people can use regardless of their physical and cognitive abilities. Or how they access your website.

Build Code With Accessibility
Photo by Zan Ilic on Unsplash

How do you build software with accessibility in mind?

In her talk at Dot Net Conference 2019, Rachel Appel explained how developers can build accessible websites without greatly changing how they code. People have variety of needs. When you develop, you need to make your code usable for people with a wide range of visual, cognitive, hearing and motor abilities.

Visual

People with visual issues include low vision, blindness and color contrast. Some people may use a screen narrator to help them navigate your website. For people using a screen narrator, use skip links. Skip links allow them to skip over the navigation and go directly to the content.

For making sure that your site is readable by as many people as possible, you can use Color Oracle, a free color blindness simulator. It is available for MacOS, Linux and Windows. You can also use Accessible Colors or WebAim’s Color Contrast Checker to ensure check your color choices.

Cognitive

People with cognitive difficulties includes learning and age-related issues. You want to keep things simple and clear. Write using short sentences, active voice and simple words. Use headings and labels to help people easily find information. See Mozilla’s Cognitive Accessibility for more tips.

Hearing

People have a wide range of hearing abilities. With videos or audio, you want to include transcripts and close captioning. In your software, don’t rely on sounds alone for feedback.

Motor

People with motor issues can have tremors, difficulty moving a mouse and more. Avoid pop-ups if you can. When you can’t, make sure that they can be closed easily. Use alt tags on all images that are not decorative.

By developing for a wide range of people, you make sure that your website is usable no matter how or where they access the web.

Read more