what's wrong with clean code?

• smaller
• fewer variables
• fewer functions

code should be comprehensible, predictable and maintainable

comprehensible

• people other than the author can understand with minimal effort

predictable

• if we look at one part, we should be able to infer about the rest

maintainable

• Easy to modify and keep up: Code runs forever

naming stuff is important

naming things changes how we reason about them

i don't care about most styling arguments

for subjective questions, just be consistent

• pick one, use the linter, never talk (or think) about it again

context is different for everyone

⛔ unclear without context

                            
                                type User = {
                                    id: number;
                                    username: string;
                                    firstName: string;
                                    lastName: string;
                                    isActive: boolean;
                                }
                            
                        

✅ clarity without context

                            
                                type User = {
                                    id: number;
                                    username: string;
                                    firstName: string;
                                    lastName: string;
                                    loggedInPrevious24Hours: boolean;
                                }
                            
                        

⛔ ambiguity kills comprehension

                            
                                class Class {}
                                class Post {}
                            
                        

✅ specificity aids everyone

                            
                                class Classroom {}
                                class BlogPost {}
                            
                        

being clear matters more than being concise or clever

⛔ abbreviations and shortcuts

                            
                                class DateUtil {
                                    static function dateStrFrmo(date: Date): string
                                    { ... }
                                }
                            
                        

✅ use properly spelled real words and names

                            
                                class DateUtil {
                                    static function getStringFromDate(date: Date): string
                                    { ... }
                                }
                            
                        

generally, class names should be nouns, methods should have verbs

Keep it simple, sweetheart

• One module/function/variable, one job

✅ keep it simple, even for complex actions

                            
                                constructor() {
                                    this.assignElements();
                                    this.setInterval();
                                    this.getNewArt();
                                    this.listenForInstructions();
                                }
                            
                        

we cannot confidently change code without tests

DRY is overrated

don't repeat yourself repeating yourself

the wrong abstraction will cost you more than repetition

existing code has inertia

don't naively trust lookalikes

comments are not a crime, but they are a dependency

⛔ don't explain the what

                            
                                const SOCIAL_MEDIA_CHARACTER_COUNT = 116;
                                // shortens title for social media sharing
                                export const getSocialShareText = (post: BlogPost) => {
                                    if (post.title.length =< SOCIAL_MEDIA_CHARACTER_COUNT) {
                                        return post.title;
                                    } else {
                                        return post.title.substr(
                                            0, SOCIAL_MEDIA_CHARACTER_COUNT
                                        );
                                    }
                                }
                            
                        

✅ explain the "why"

                            
                                // Twitter has shortest character limit (140); URL shortener is always 23
                                const SOCIAL_MEDIA_CHARACTER_COUNT = 116;
                                export const getSocialShareText = (post: BlogPost) => {
                                    if (post.title.length =< SOCIAL_MEDIA_CHARACTER_COUNT) {
                                        return post.title + ' ' + post.url;
                                    } else {
                                        return post.title.substr(
                                            0, SOCIAL_MEDIA_CHARACTER_COUNT
                                        ) + ' ' + post.url;
                                    }
                                }
                            
                        

use ternaries sparingly

✅ use declarative ternaries, with formatting

                            
                                const title = (postRequest['title']) 
                                            ? postRequest['title'] 
                                            : '';

                                const title = postRequest['title'] || '';
                            
                        

don't test standard library functions unless you're not testing functionality

                            
                                describe('getSocialMediaText restricts to Twitter length', ()=> {
                                    it('when title is less than length', () => {
                                        const res = getSocialMediaText(MockPostShortTitle);
                                        expect(res.length =< 116)
                                    }),

                                    it('when the title is more than length', () => {
                                        const res = getSocialMediaText(MockPostLongTitle);
                                        expect(res.length =< 116)
                                    })
                                });