Skip to content

Instantly share code, notes, and snippets.

@webbower
Created July 2, 2021 17:16
Show Gist options
  • Save webbower/a02203ee13a03182cf30d03f2a955581 to your computer and use it in GitHub Desktop.
Save webbower/a02203ee13a03182cf30d03f2a955581 to your computer and use it in GitHub Desktop.
HTML/CSS/JS Patterns
// Option 1
let var1, var2, var3;
if (someCondition) {
var1 = 'value1';
var2 = 'value2';
var3 = 'value3';
} else {
var1 = "other1";
var2 = "other2";
var3 = "other3";
}
// Option 2
const var1 = someCondition ? 'value1' : 'other1';
const var2 = someCondition ? 'value2' : 'other2';
const var3 = someCondition ? 'value3' : 'other3';
// Better
const [var1, var2, var3] = someCondition
? ["value1", "value2", "value3"]
: ["other1", "other2", "other3"];
// Usually
API.fetch(data)
.then(response => {
if (response.success) {
handleSuccess(response);
} else {
// Duplicate error handler call
handleError(???);
}
})
.catch(error => {
handleError(error);
});
// Better
API.fetch(data)
.then(response => {
// Validate data of successful response
if (response.success) {
// Forward successful response
return response;
} else {
// Route to single rejection handler with a descriptive error
return Promise.reject(new Error('Processing was not successful'));
// OR
// throw new Error('Processing was not successful');
}
})
.then(
// Unconditionally handle success
handleSuccess,
// Single point of error handling
handleError
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment