Front-End Web Daily

Today is September 4, 2020, and for this Friday Facts episode we're covering:

Let's dive in!

----

A web design portfolio can be one of the most difficult things to create. It can be hard to think up new ideas and projects to build from scratch. Yesterday, The Next Web posted several suggestions to help create a great portfolio to land your dream job, including designing a WordPress theme and creating a UI toolkit. These are the perfect starting points to build the perfect portfolio.

----

Telecommuting has become one of the most popular ways to work, whether it was forced upon us or not. While it seems to be here to stay, and certainly in a bigger way into the future, it certainly can be difficult for people who are not used to it. Noupe posted an extensive guide to successful teleworking that is definitely worth the read. Learn about advantages, disadvantages, and best practices for effective telecommuting.

----

As web designers and developers it is important to continue to learn in this industry that is continually changing and evolving around us. However, it can be difficult to find the time and the resources to do so. Webdesigner Depot posted a list of great free resources to help learn new skills and stay up-to-date, including edX and Envato.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is September 3, 2020, and for this Thursday Thoughts episode we're covering:

Let's dive in!

----

Starting a freelance business is the dream for many web designers and developers. Making your own schedule and working from anywhere are some of the benefits but there are also many cons to consider. Before you quit your full-time job and dive right in, read through Sunday's post from Pixel77 about things to consider when creating a freelance business and actionable steps to start with.

----

So, you've started a freelance business, now comes the important part: getting clients. Before you start, take a look at the post from earlier this month on creative.onl that gives several suggestions on how to earn new clients for your business. They vary from proposals to content marketing to referrals and give methods for succeeding at each.

----

Now that you have your business and you are getting clients, how do you maintain and grow your business? The key is creating habits to make your business life consistent and run smoothly. There are several habits you can adopt, many of which are outlined in yesterday's post on Dribbble, including setting up systems and marketing daily.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is September 2, 2020, and for this Wednesday Wisdom episode we're covering:

Let's dive in!

----

Burnout is defined by the World Health Organization as "a syndrome conceptualized as resulting from chronic workplace stress that has not been successfully managed." And this stress is very common among developers who are frequently overworked and stressed. A recent post on The Next Web goes into detail regarding burnout for developers outlining what is burnout, possible syndromes developers might experience, common causes, and prevention. It is a very educational read that is perfect for anyone, but especially developers.

----

Pull requests are an integral and important part of open-source and almost any other form of development. This is why writing a good pull request description is critical for maintaining the code base efficiently and effectively. A post last week on freeCodeCamp outlined the components of a pull request description and why they are necessary. While each developer and even each repository might have its own format, it never hurts to have a refresher on key components for a quality pull request description.

----

There are many different ways to reach the same outcome with JavaScript. But some of these ways may give away that you are a novice developer, or at least have the coding habits of one. A post on Monday in the DEV Community highlights a couple of ways that you can improve your code to show that you are not just beginning your JavaScript career. Learn the strategies of "not overusing if and else statements" and "not using functional programming in a nonfunctional way."

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is September 1, 2020, and for this Tuesday Tips episode we're covering How to Integrate Media Queries into JavaScript

Let's dive in!

----

There's no doubt about it, media queries are one of the most useful CSS features for a modern website. They allow you to create a breakpoint for your website where you can adjust styles for larger or smaller screen sizes. While this is great for use in CSS, what if you want to utilize media queries in JavaScript?

----

As with anything in JavaScript, there are multiple ways to accomplish a task. For example, a method for recognizing media queries in JavaScript is to check if an element is visible. So, if the mobile menu button is visible do a certain JS function. And you would put this in a function whenever the window resizes. While this may get the job done, there is perhaps a better and cleaner way to accomplish the same task.

----

There is a window listener in JavaScript called matchMedia which will listen for a specific value and trigger when true. For example:

When we add a listener to the variable it can run a function:

This opens the possibility of passing any function to the listener and only having that function run on certain screen widths.

----

The matchMedia function is widely supported, including full support for Internet Explorer 10 and 11.

----

Today’s Tuesday Tips was adapted from a post on Daily Dev Tips.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 31, 2020, and for this Monday Medley episode we're covering:

Let's dive in!

----

One of the greatest parts of being a developer is using and participating in open-source projects. But it can seem intimidating for first-time developers to jump into a project. A post yesterday on the DEV community goes through how to contribute to an open-source project for beginners. It outlines some basic skills you might need to get started and some initial ideas for how to contribute.

----

On Friday, Bootstrap released the first stable version of its custom icons. With over 1,100 icons in the initial release, you are bound to find the icon you are looking for. The icons are SVG-based, which makes them very versatile in their utility. Read more about Bootstrap icons from the release notes and the documentation.

----

Frontity allows for a headless version of WordPress with a React front-end. This means that you can manage your website content in WordPress and utilize the API functionality to create the front-end using a modern front-end framework and features. On Friday, LogRocket posted about getting started with Frontity, which walks through the process of setting up a website with Frontity. For those who love to use WordPress and build React websites, it is the perfect combination.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 28, 2020, and for this Friday Facts episode we're covering:

Let's dive in!

----

Landing pages are still an important promotional tool for many modern businesses. They allow a company or individual to promote a product, email list, or other services in a small and concise package. They are the perfect place to drive marketing campaigns and advertisements with a tailored page specifically designed for those leads. However, there is an art to designing these pages, and a post yesterday from Line25 lists things to avoid when creating the perfect landing page.

----

Website design and development is constantly changing and evolving, which is why it is important to keep your skills and your website up to date. On Wednesday, a post on Torque, a publication by WPEngine, highlighted key elements for a high-quality website in 2020. Topics included ease of use, fast loading, and accessibility and are a great point of reference to assess anyone's website.

----

While mailing lists may seem outdated they still rank as one of the best content marketing tactics with some of the highest engagement rates. But it isn't as easy as it sounds to build a massive email list, especially in 2020 when every website seems to have one. Creative.onl shared a post on Monday outlining 5 techniques to get more newsletter sign-ups, which goes into detail on specific actions you can take, such as creating a compelling offer and properly utilizing a thank-you page.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 27, 2020, and for this Thursday Thoughts episode we're covering:

Let's dive in!

----

As freelancers, we are always looking for new ways to establish our business as an expert in our respective fields. Content marketing has always been a staple strategy to drive our business forward, examples being blogs, ebooks, webinars, and podcasts. But it is important to be on the lookout for new strategies to help elevate our businesses to the top of the leaderboards. Check out yesterday's post on The Next Web for content marketing strategies, both old and fresh.

----

Google Analytics has been around for a long time and has been a standard for every website. However, the age of serverless has brought about Netlify and their analytics service. For me, it can be hard to tell exactly how my analytics data is formed and it certainly becomes an overwhelming amount of information. Having had no experience with Netlify's analytics I found Jim Nielsen's July blog post to be incredibly informational as he compares the two services. The post is very in-depth and even offers some conflicting analytics between the two, which still makes me wonder just how accurate any of these services are.

----

If you're like me (and a lot of other people) you may struggle to be productive during your workday. Especially now with so many people still working from home or adjusting to the new normal in a changed office setting, it is perhaps the hardest it has ever been to be productive. A post yesterday by actiTime highlighted some key ways to boost productivity and each is backed a great person in history who suggested it. If you're looking for some new ways to boost your productivity or just need a refresher, give the article a read!

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 26, 2020, and for this Wednesday Wisdom episode we're covering:

Let's dive in!

----

With the recent release of WordPress 5.5, an auto-update feature was added for plugins and themes. This goes along with the auto-update feature for WordPress Core that was recently added. Allowing your WordPress site to update your themes or plugins can have pros and cons, which are highlighted in a recent post on speckyboy.com. Luckily, you can choose to toggle this feature on a per theme or plugin basis.

----

Yesterday, Dribbble posted a list titled 10 online design tools you never knew you needed. The list includes many great online tools like a brand book creator, a free screen recorder, and a sub-list of Chrome extensions. The next time you are starting a project, check out some of these awesome design tools!

----

Yesterday, SitePoint posted a phenomenal in-depth article comparing Facebook's React framework to Google's Angular. The post compares and contrasts their features, ecosystems, and more. It is a great read for developers of all skill sets with these frameworks and is a good read to decide which framework works best for you.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 25, 2020, and for this Tuesday Tips episode we're covering How to Determine Where to Put Logic for Jamstack Websites

Let's dive in!

----

A very common blog logic is displaying posts or events on your website based on the date. We may want to not show a post if it is in the future or change how a past event is displayed. When looking at a Jamstack website this can be confusing as there are several places in the build lifecycle that this logic can occur. And each occurrence comes with its own limitations.

----

The first option is to hardcode the elements by physically adding or modifying them in the HTML files. This is the most reliable as it happens before the website is built. However, this is also less than optimal: who wants to change their website manually every time a post needs to be published or an event passes?

----

The second option is to write structured data and do the logic at build time. Using a headless CMS or other ways to store data files, such as Markdown, we can utilize a static site generator to build our website. The generator would then use logic during the build process to display what we want. So, we could use conditional logic to say if the post is in the future do not display it or if the event has passed use the grayed out styles.

The issue with this process is that once the website is built it will not change until the next build. So, if we build the website today and have an event tomorrow, our website on the following day would still have it as an upcoming event. We could solve this issue by automating our build process every day or even every hour.

----

A less readily available option would be to do the logic with edge workers that would execute on a CDN request. The render function for our website would then update the website files every time a user requests it. This feature is still in the works but the ideal end goal is that it would perform nearly as well as a static site but allow for updates on each request.

----

The last option is to pass data to the front end and then execute the logic. For example, we might use an HTML data attribute for our event or post. Then, using this attribute, we could conditionally style the event using front-end JavaScript. This would not require a new build but could seem a bit clunky on the code side. However, if the performance is not affected and your user experience is working well then this might not be an issue.

In the end, it all comes down to the data you are trying to display, when it needs to be updated and how much manual work you are willing to put in each time.

----

Today’s Tuesday Tips was adapted from a post on CSS-Tricks.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!

Today is August 24, 2020, and for this Monday Medley episode we're covering:

Let's dive in!

----

Web Designer Depot recently posted a list of 47 most appreciated web solutions of 2020. The list ranges across many areas of web design, including WordPress tools, logo creators, and other web development services. Check out the list for some services you have seen and new ones you can add to your tool belt.

----

Bootstrap has been an industry-standard framework to make it easier to develop modern responsive websites. However, Bootstrap has opened the door for a long list of alternative frameworks, each with their own merits. A recent post on the DEV community highlights five alternatives to Bootstrap, including Tailwind CSS, a personal favorite of ours.

----

A post on the DEV community on Saturday gives a great list to help become a full-stack developer without a degree. The list includes tangibles like "one big project" as well as soft skills like personality and drive. It is a great start for new developers looking for some guidance on getting to the next step.

----

Want to know more? Head to fewdaily.com for more of today’s topics and other front-end web content! If you liked what you heard be sure to rate, review, and subscribe on your platform of choice. That's all for today, tune in tomorrow!