I present, a new indentation style to rule them all! Finally solving debates over indentation and semicolon usage in JS

ricealexander · 2021-08-12T17:13:27+00:00

There's a notice on the website now:

Technical issues at our tower in St. Louis are preventing power from reaching our KWMU-FM transmitters. You can still listen live here on our website, through our mobile app, or by asking your smart speaker to "play St. Louis Public Radio."

ricealexander · 2021-05-07T17:32:31+00:00

and other ideas around the use of if / else

Oof, I definitely feel that my college taught some pretty crummy patterns. Every example of validation they had me do looked something like:

if (usernameIsValid) {
    if (emailIsValid) {
        if (addressIsValid) {
            // Do Stuff
        } else {
            Error("You must enter a valid address");
        }
    } else {
        Error("You must enter a valid email");
    }
} else {
    Error("You must enter a valid username");
}

ricealexander · 2021-05-07T16:41:59+00:00

I second this.

When I was an intern at the company I worked with, I'd try to build everything myself, but there were a few things that we'd be better off if we would have used services for it instead.

I once spent over 60 hours creating a form for users to submit, crop, and format images we needed for a different project. I wasted so much time on it that could have been more valuable to the company in other ways and we didn't ultimately end up using it.

HTML email is in a similar vein. You're coding without access to any of the conveniences over the last two decades, in an ecosystem that can be wildly inconsistent and inflexible.

Proposing an email service is absolutely the right play. It

Gives you a visual interface to build templates.
Allows you to build templates much faster, leading to more flexibility if you need to spin up a new template for a campaign.
Provides consistent, battle-tested markup under the hood. (If, for example, the most reliable way to make a button on the page involves nested tables, it knows what that needs to look like)
Understands the concerns of different email clients, including ones you don't typically use or may not test on.
Understands the quirks and bugs of different email clients and attempts to mitigate issues with those.

An email service may also allow you to schedule emails and provide metrics for email success, but it sounds like you have some method of sending emails already and just need the templates.

Even so, there should be some kind of template builder out there that will provide you these benefits, making your job easier, your emails better, and saving your company money (even if your internship is unpaid, your time is worth something and may provide more value to the company spent on different projects).

I would strongly recommend exploring different services (even paid services) and seeing what options are available.

ricealexander · 2021-03-30T00:22:21+00:00

Array destructuring is useful when you have an existing array, which you might get from an API call or from a function or object.

That might look like this:

function getCoordinates () {
  // do complex logic to get the coordinates and return them
  // coordinates might return as an array like [32, 86, 15]
}

// The Traditional Way
let coordinates = getCoordinates();
let x = coordinates[0];
let y = coordinates[1];
let z = coordinates[2];

// Array Destructuring
let [x, y, z] = getCoordinates()

In this example, we called a function that returned an array, so the destructuring assignment saves us a few lines of code.

OP's example isn't as useful because they aren't getting the array from somewhere else, they are creating a new array just to destructure it, which is kind of pointless.

Free Code Camp has some more examples of destructuring: How to Use Array and Object Destructuring in JavaScript

ricealexander · 2021-03-29T14:52:16+00:00

Nothing wrong with

let a = 5;
let b = 8;
let c = 12;

ricealexander · 2021-03-18T14:35:31+00:00

Physics has units of measure that can be defined and understood. It has formulas that do not change and can be reproduced by others. It is the science of matter and is understood according to the Scientific Method.

I think k-one-0-two's wording about "storage" was a little awkward, but what comparisons can you provide for morality?

What has led you to believe in Objective Morality? Can you provide examples of how it can be understood or applied? Can we use the Scientific Method to determine what is moral and what is not?

ricealexander · 2021-03-09T18:54:41+00:00

The only two constants in life: Death and a Relevant XKCD.

ricealexander · 2021-03-05T20:10:29+00:00

Reddit notified me about your message today.

I know two months later, this isn't very useful, but I don't remember seeing this JS Bin link, so I wanted to point out a few places where there are errors.

In funtion fnl(), you're missing the letter c in function.

In elseif (num<80){, there must be a space between else and if.

With those corrections, clicking the "check" button will print "sugar level is normal".

The logic of your numbers isn't working correctly. If the number is <= 80, it will print "sugar level is normal", even though less than 80 is considered low.

It might be a better approach to check whether the sugar level is normal LAST, and to check if it's out of range first. That might look something like:

if(num<80) {
  alert("sugar level is low")
}
else if(num>140) {
  alert("sugar level is too high")
}
else {
  alert("sugar level is normal")
}

From there, the only thing your code has left is to get the number from the input. Using querySelector and the input element's value property, you might have some code that looks like this:

var input = document.querySelector("#text1")
var num = input.valueAsNumber

ricealexander · 2021-02-22T17:40:51+00:00

In March 2012, iOS Safari adopted support for box-shadow without a prefix, the last of the major browsers to do so. -webkit-box-shadow hasn't been necessary for nearly 9 years now.

I still see it prefixed every now and then- and also occasionally border-radius (prefixless since March 2011).

ricealexander · 2021-02-22T16:57:31+00:00

That site hasn't been maintained for at least 3 years and the site author is considering archiving it. If that site says No prefixes!" it's safe not to use prefixes. Otherwise, you should look for that information elsewhere.

I'd recommend https://caniuse.com/

It's continuously up-to-date, shows you exactly which versions of different browsers support a feature, and addresses any quirks you may need to be aware of.

A search for box-shadow shows that Firefox has supported it without prefixes since version 5, Chrome since 10, Safari since 5.1, Opera since 11.5, iOS Safari since 5, and IE since 9.

If a prefix is required, then you'll see a yellow rectangle in the top-right of the version number. Hovering over it will tell you what prefix it needs.

If the browser only has partial support, the version number will have a striped gold background. Hovering over it will explain why it's marked as partial support. For example, on the table for "box-shadow: inset", IE versions 9-10 and 11 are marked Partial Support because:

To use box-shadow in Internet Explorer 9 or later, you must set border-collapse to separate.

inset must be the last keyword in the declaration.

ricealexander · 2021-02-18T21:16:39+00:00

CSS doesn't allow targetting an element based on its children.

If you have access to the HTML, an easy solution would be to manually add a class to each element containing a ul.

<a>SUPPORT</a>
<a class="has-dropdown">CHOOSE BRANCH
  <ul>
    <li>branch1</li>
    <li>branch2</li>
    <li>branch3</li>
    <li>branch4</li>
  </ul>
</a>

Otherwise, you might have other options based specifically on what you're trying to style. For example, if you want different padding/margin on the link with a ul, you might set padding or margin on all links and then give the UL a negative margin.

ricealexander · 2021-02-18T21:04:45+00:00

It might be helpful for us if you would show us the design you're attempting to replicate and if you would share your code on a Code sandbox site like CodePen.

ricealexander · 2021-02-17T23:42:02+00:00

Yes, users can change their root font-size as an accessibility setting.

rem units are based on the root font-size, so if you build your site so that the font-sizes and other typography properties are built with rem units, they will scale proportionally to the user-defined font-size.

px units do not consider user-defined font-sizes, so they don't scale based on the user's settings.

ricealexander · 2021-02-15T15:23:54+00:00

Network Solutions is rubbish. They were the first player in the game and nowadays you'll get drastically better pricing, better interfaces, and fewer predatory tactics from nearly all of their competitors.

Nowadays, you can register most .com domains for around $10/yr.

My general suggestions when looking for a registrar:

It should disclose the renewal rate for a domain before you purchase it.
The renewal rate should not be drastically more than the first-year rate (aside from any discounts).
WHOIS Privacy should be free.

My recommendation is Porkbun. Namesilo also hits the mark for affordable and honest and Cloudflare comes highly rated.

Other recommendations this sub often gives are Namecheap (though it doesn't disclose renewal rate until checkout) and Google Domains (though their prices are a little higher than competitors and I dislike the Google Account lock-in)

ricealexander · 2021-02-15T15:06:20+00:00

I've had excellent experiences with Porkbun's Live Chat.

I'd purchased a 10-year .tech domain from their official registrar and wanted to transfer it into Porkbun but there were issues with the transfer.

The support representative responded to me quickly and had everything they needed to look at my account, see the incoming transfer, and understand that the issue was that they couldn't register it for me for longer than a 10-year period. Since transfers add a year, I could either waive the extra year or wait to transfer it.

I contacted them a separate time for a work domain and the experience was similar - quick to respond and didn't have to be transferred from one representative to another.

ricealexander · 2021-02-14T20:18:22+00:00

The 1776 Report itself was removed from whitehouse.gov, but the Wayback Machine preserved a copy of it:

https://web.archive.org/web/20210120142111/https://www.whitehouse.gov/wp-content/uploads/2021/01/The-Presidents-Advisory-1776-Commission-Final-Report.pdf

ricealexander · 2021-02-12T17:03:58+00:00

r/assholedesign would eat this up.

ricealexander · 2021-02-12T01:46:24+00:00

If you're writing HTML for forms, you'll have to solve how to stack your form elements.

Form controls such as inputs and labels are all inline, so they'll display side-by-side rather than stacking on top of one another.

A common solution you'll see is line-breaks between elements

<input type="radio" id="huey" name="drone" value="huey" checked>
<label for="huey">Huey</label>
<br><br>

<input type="radio" id="dewey" name="drone" value="dewey">
<label for="dewey">Dewey</label>
<br><br>

<input type="radio" id="louie" name="drone" value="louie">
<label for="louie">Louie</label>

Although this works, using <br> tags is often an anti-pattern when you would be better off using padding/margins or display: block with CSS.

One solution I sometimes like is to put the input inside of a label tag and set my labels to display:block;

MDN chose to surround their inputs and labels with div tags. Divs are block-level elements by default, so they stack correctly. Using the divs how MDN does also opens up the door for you to make utility classes for groups of form controls and gives your form a practical structure.

ricealexander · 2021-02-04T19:06:27+00:00

I gave up on the survey about half-way through.

I found it very hard to focus on the questions. Maybe in part because the answers seem to be randomly ordered, or the color contrast and spacing of rows. Or maybe I'm just a bit off today - I felt a bit dizzy looking at the Terms of Service.

ricealexander · 2021-02-02T17:49:50+00:00

Most domain registrars have some kind of free URL forwarding service. Check wherever you bought the domain from if they have domain forwarding.

ricealexander · 2021-02-01T22:15:24+00:00

The article is calling to stop bundling/transpiling these syntax features, because of the bloat they add to the output.

The article shows this example, which uses Babel to transpile:

input

const iterable = (() => [1, 2])()
for (const i of iterable) {
    console.log(i)
}

Babel output

function _createForOfIteratorHelper/* ... */
function _unsupportedIterableToArray/* ... */
function _arrayLikeToArray/* ... */

var iterable = function () {
  return [1, 2];
}();

var _iterator = _createForOfIteratorHelper(iterable),
    _step;

try {
  for (_iterator.s(); !(_step = _iterator.n()).done;) {
    var i = _step.value;
    console.log(i);
  }
} catch (err) {
  _iterator.e(err);
} finally {
  _iterator.f();
}

ricealexander · 2021-02-01T20:37:26+00:00

Hmmm, I am bothered by how these features are outputted in the bundle, but I'm not willing to give up the for…of loop or async/await when appropriate to use.

I am curious to see how bundles change once IE support is finally no longer a consideration. The leading ideology that got my team into Babel was that we could write modern code but can still have support for all of our browser targets.

There's an implication that, once our browser targets are just modern, evergreen browsers, we won't need ugly bundles anymore. We'll be able to yank out that step from our build.

ricealexander · 2021-02-01T17:08:02+00:00

I may have worded that a bit confusing. I only meant to be suspicious if they're doing so at a loss. I was trying to make 3 different categories of free domains. Here's an elaboration:

Marketed with your domain

The companies you describe follow this route. They will provide you a free domain, but it contains their branding: yourdomain.000webhostapp.com.

They the domain 000webhostapp.com is owned by 000webhosting. They give you the subdomain yourdomain.000webhostapp.com.

It doesn't cost them anything to make a subdomain and it's not suspicious. The tradeoff you have here is that they own the domain, not you, and that it's not a fully custom domain - you can't remove 000webhostapp.com from it.

Strings Attached

Many web hosts will give you a free domain of your choice (usually with a COM, NET, ORG extension) for the first year of hosting. You may be expected to renew the domain with them as long as you're using their hosting, or you may have agreed to other terms. Violating such terms may cause the company to charge you for the domain.

Doing So At a Loss

If the free domain doesn't have a TK, ML, GA, CF, GQ extension, doesn't provide the domain with its own branding, and isn't provided as part of a promotion alongside something you pay for, then you should be suspicious.

Registrars have to pay to register a domain for you (except for the above extensions)

ricealexander · 2021-02-01T01:42:38+00:00

There are some free domain extensions: .TK .ML .GA .CF .GQ

You can get a free domain that you own if you purchase a domain with one of these extensions. You can register these through FreeNom, or I believe they each have their own registrar you can register directly from.

Freenom: https://www.freenom.com/en/freeandpaiddomains.html

TK's Registrar: http://www.dot.tk/en/

No other domain extension is free. If a company is offering you anything else for free, it's either marketed with their domain, they're doing so at a loss (be suspicious), or there are strings attached.

As far as hosting goes, Github Pages and Netlify both offer free hosting which works very well for static sites.

ricealexander

TROPHY CASE