Alexi Taylor 🚀

WebStorm > VSC

Using git push --force could remove the commit history of a remote repo, but can easily be fixed if the developer has a local version by using git push origin HEAD:master --force.

Although this resource is not free I highly recommend Frontend Masters. Kent C. Dodds has a great course on Advanced React Patterns and Testing with React. I also receive newsletters from JavaScript Kicks, Frontend Focus and Medium.

Another approach (different than the general passing props answer) you can use the Provider Pattern to share state to nested child components. Provider Pattern The Provider Pattern solves the problem of prop drilling. It uses React's Context API and the compound components pattern. The Provider pattern allows sharing state anywhere in the tree without drilling props to child components by exposing the React's Context.Consumer to child components. Compound Components Think of compound components like the <select> and <option> elements in HTML; the parent component acts as a wrapper to all child components where the parent component (provider component) manages shared state while the child components (consumer components) can access and update the shared state. Context API The Context API has 3 key parts: React.createContext: Creates a Context object. Context.Provider: Every Context object comes with a Provider Component that allows consuming components (child components) to subscribe to context changes. It accepts a value prop to be passed to consuming components that are descendants of this Provider. Context.Consumer: A React component that subscribes to context changes. This lets you subscribe to a context within a functional component. Parent Component const ToggleContext = React.createContext({ on: false, toggle: () => {}, reset: () => {}, getTogglerProps: () => {} }); class Toggle extends React.Component { // Consumer, a static property // We are not exposing the entire ToggleContext object to the user // and we can use the component consumer directly off the Toggle Component static Consumer = ToggleContext.Consumer; //.... render() { // Now we'll be exposing the state and helpers via React's context API. const { children } = this.props; // Using both the provider pattern and render props pattern const ui = typeof children === "function" ? children(this.state) : children; return ( <ToggleContext.Provider value={this.state}>{ui}</ToggleContext.Provider> ); } } Child Components function NavSwitch() { return ( <div className="nav-switch"> <Toggle.Consumer> {toggle => ( <Switch {...toggle.getTogglerProps({ on: toggle.on })} /> )} </Toggle.Consumer> </div> ); } function Text() { return ( <Toggle.Consumer> {toggle => (toggle.on ? "️️On" : "Off")} </Toggle.Consumer> ); } App Component function App() { return ( <div className="App"> <Toggle> <div> <Header /> <Text /> </div> </Toggle> </div> ); }

In my opnion, the article is defining a Senior Software Architect role.

The most popular front-end frameworks (at the moment) is React and Angular (followed by Vue). React has small learning; hence it's popular among Junior Developers and personal projects on GitHub. Angular offers an enhanced developer experienced by providing features straight out of the box, e.g., routing, CLI, dependency injection (great for state management), TypeScript. In React you have to depend more on third-party libraries and determine the right architecture which slows down development and productivity. In Angular, you can create a service and use dependency injection to efficiently manage state across multiple components allowing for separation of concern. While in React you have to use libraries like Redux which will dramatically increase your code foot-print. Since React is un-opinionated and easier to create script-kiddy code, it could lead to a messy code-base. But this can easily be fixed by creating an opinionated style guide for syntax, conventions, and structuring for your team. Finally, I believe Angular reduces the complexity that other frameworks tend to hide under the hood. If you're coming from a .NET background and have experience with C# or even Java you might prefer Angular since TypeScript has a few similar concepts such as interfaces, decorators, private attributes, classes, getters and setters, and of course it's strongly-typed. With that said, I don't think one framework is superior to the other. With any front-end framework, you can create an awesome application as long as you understand the fundamentals of programming. Most companies will hire front-end developers based on your JavaScript and programming fundamentals and not because you know a specific framework. Instead, pick a framework, learn it and then move on to the next one.

The most popular front-end frameworks (at the moment) is React and Angular (followed by Vue). I think React is the perfect answer. React has small learning; hence it's popular among Junior Developers and personal projects on GitHub. Angular offers an enhanced developer experienced by providing features straight out of the box, e.g., routing, CLI, dependency injection (great for state management), TypeScript. In React you have to depend more on third-party libraries and determine the right architecture which slows down development and productivity. In Angular, you can create a service and use dependency injection to efficiently manage state across multiple components allowing for separation of concern. While in React you have to use libraries like Redux which will dramatically increase your code foot-print. Since React is un-opinionated and easier to create script-kiddy code, it could lead to a messy code-base. But this can easily be fixed by creating an opinionated style guide for syntax, conventions, and structuring for your team. Finally, I believe Angular reduces the complexity that other frameworks tend to hide under the hood. With that said, I don't think one framework is superior to the other. With any front-end framework, you can create an awesome application as long as you understand the fundamentals of programming. Most companies will hire front-end developers based on your JavaScript and programming fundamentals and not because you know a specific framework. Instead, pick a framework, learn it and then move on to the next one.

NestJS is a server-side framework for Node that encourages developers to easily take advantage of software engineering paradigms like Domain Driven Design, Event Sourcing, and Microservices Architecture. The framework is heavily inspired by Angular which can be seen with its use of controllers, providers, modules, pipe, and folder structure.

*24 - 48 hour deadline and max of a few hours of coding.

The mind game quizzes and replacing it with small 1- 2 day projects, spec'd out or not, that showcases the devs day to day skills. I had one interview where I had to find an open GitHub issue on an open source project, provide a fix and create a pull request. A great way to showcase coding methods, style, and problem-solving.