webapp posts - idmontie's Portfolio

/*@jsxRuntime automatic @jsxImportSource react*/
const {Fragment: _Fragment, jsx: _jsx, jsxs: _jsxs} = arguments[0];
function _createMdxContent(props) {
  const _components = Object.assign({
    p: "p",
    ul: "ul",
    li: "li"
  }, props.components);
  return _jsxs(_Fragment, {
    children: [_jsx(_components.p, {
      children: "I was thinking about all the little projects I work on and how they grow over time. The applications end up hitting some milestones and end up needing similar functionality that compliments the core features. A small project ends up getting complex enough that it requires some unit tests. I’ll go to deploy the project and now I need some deployment scripts and analytics to ensure the application is running correctly. The technology may change between each project, but web applications always seem to have the same steps that need to be taken to strengthen the application as it is scaled up."
    }), "\n", _jsx(_components.p, {
      children: "At a large company, adding a new set of functionality always has a suite of concerns to think through before implementation: how will we deploy this feature, how do we validate that users are using the feature like we expected them to, how do we monitor for bugs and errors? This is on top of the basic functionality of actually writing and testing that new feature."
    }), "\n", _jsx(_components.p, {
      children: "What if we thought about this like Maslow’s Hierarchy of Needs, but in the context of a web application."
    }), "\n", _jsx(_components.p, {
      children: "Maslow's Hierarchy of Needs is a psychological model of human motivation proposed by Abraham Maslow in 1943. The model describes a hierarchy of human needs, beginning with basic physiological needs such as food and shelter and progressing upwards to higher-level needs such as self-actualization. Maslow argued that as humans satisfy their basic needs, they can move on to satisfy their higher-level needs."
    }), "\n", _jsx(_components.p, {
      children: "Applying Maslow's Hierarchy of Needs to web applications, we can identify the different levels of needs that need to be met in order to make a web application successful."
    }), "\n", _jsx(_components.p, {
      children: "Basic functionality:"
    }), "\n", _jsxs(_components.ul, {
      children: ["\n", _jsx(_components.li, {
        children: "A single build/run script"
      }), "\n", _jsx(_components.li, {
        children: "Basic functionality (e.g. CRUD operations for a web app)"
      }), "\n", _jsx(_components.li, {
        children: "User interface (e.g. layout, navigation, responsive design)"
      }), "\n", _jsx(_components.li, {
        children: "Integration with external services (e.g. databases, APIs)"
      }), "\n"]
    }), "\n", _jsx(_components.p, {
      children: "Safety and security:"
    }), "\n", _jsxs(_components.ul, {
      children: ["\n", _jsx(_components.li, {
        children: "Linting (e.g. ESLint, Prettier)"
      }), "\n", _jsx(_components.li, {
        children: "Unit tests (e.g. Jest, Mocha)"
      }), "\n", _jsx(_components.li, {
        children: "Basic error handling and reporting (e.g. logging, alerting)"
      }), "\n", _jsx(_components.li, {
        children: "Input validation (e.g. form validation)"
      }), "\n", _jsx(_components.li, {
        children: "Security best practices (e.g. encryption, password hashing, session management)"
      }), "\n"]
    }), "\n", _jsx(_components.p, {
      children: "Love and belonging:"
    }), "\n", _jsxs(_components.ul, {
      children: ["\n", _jsx(_components.li, {
        children: "Basic analytics (e.g. page views, user engagement)"
      }), "\n", _jsx(_components.li, {
        children: "User authentication and authorization (e.g. sign-up, login, role-based access control)"
      }), "\n", _jsx(_components.li, {
        children: "User feedback (e.g. contact form, survey)"
      }), "\n", _jsx(_components.li, {
        children: "Social media integration (e.g. sharing, commenting)"
      }), "\n"]
    }), "\n", _jsx(_components.p, {
      children: "Esteem:"
    }), "\n", _jsxs(_components.ul, {
      children: ["\n", _jsx(_components.li, {
        children: "Advanced analytics (e.g. user behavior tracking, A/B testing)"
      }), "\n", _jsx(_components.li, {
        children: "Performance monitoring (e.g. load testing, monitoring of server resources)"
      }), "\n", _jsx(_components.li, {
        children: "User experience optimization (e.g. user testing, usability analysis)"
      }), "\n"]
    }), "\n", _jsx(_components.p, {
      children: "Self-actualization:"
    }), "\n", _jsxs(_components.ul, {
      children: ["\n", _jsx(_components.li, {
        children: "End-to-end testing (e.g. Selenium, Cypress)"
      }), "\n", _jsx(_components.li, {
        children: "Accessibility and internationalization (e.g. support for screen readers, translation)"
      }), "\n", _jsx(_components.li, {
        children: "Scalability (e.g. load balancing, caching)"
      }), "\n", _jsx(_components.li, {
        children: "Continuous integration and delivery (e.g. Jenkins, Travis CI)"
      }), "\n", _jsx(_components.li, {
        children: "Deployment (e.g. Docker, Kubernetes)"
      }), "\n", _jsx(_components.li, {
        children: "Automated testing (e.g. unit test, integration test)"
      }), "\n"]
    }), "\n", _jsx(_components.p, {
      children: "Of course this list isn’t exhaustive, but I’ve been thinking about it as more of a checklist to build upon when working on small side-projects that end up getting significant attention and development time."
    })]
  });
}
function MDXContent(props = {}) {
  const {wrapper: MDXLayout} = props.components || ({});
  return MDXLayout ? _jsx(MDXLayout, Object.assign({}, props, {
    children: _jsx(_createMdxContent, props)
  })) : _createMdxContent(props);
}
return {
  default: MDXContent
};


I was thinking about all the little projects I work on and how they grow over time. The applications end up hitting some milestones and end up needing similar functionality that compliments the core features. A small project ends up getting complex enough that it requires some unit tests. I’ll go to deploy the project and now I need some deployment scripts and analytics to ensure the application is running correctly. The technology may change between each project, but web applications always seem to have the same steps that need to be taken to strengthen the application as it is scaled up.
At a large company, adding a new set of functionality always has a suite of concerns to think through before implementation: how will we deploy this feature, how do we validate that users are using the feature like we expected them to, how do we monitor for bugs and errors? This is on top of the basic functionality of actually writing and testing that new feature.
What if we thought about this like Maslow’s Hierarchy of Needs, but in the context of a web application.
Maslow&#x27;s Hierarchy of Needs is a psychological model of human motivation proposed by Abraham Maslow in 1943. The model describes a hierarchy of human needs, beginning with basic physiological needs such as food and shelter and progressing upwards to higher-level needs such as self-actualization. Maslow argued that as humans satisfy their basic needs, they can move on to satisfy their higher-level needs.
Applying Maslow&#x27;s Hierarchy of Needs to web applications, we can identify the different levels of needs that need to be met in order to make a web application successful.
Basic functionality:
<ul>
<li>A single build/run script</li>
<li>Basic functionality (e.g. CRUD operations for a web app)</li>
<li>User interface (e.g. layout, navigation, responsive design)</li>
<li>Integration with external services (e.g. databases, APIs)</li>
</ul>
Safety and security:
<ul>
<li>Linting (e.g. ESLint, Prettier)</li>
<li>Unit tests (e.g. Jest, Mocha)</li>
<li>Basic error handling and reporting (e.g. logging, alerting)</li>
<li>Input validation (e.g. form validation)</li>
<li>Security best practices (e.g. encryption, password hashing, session management)</li>
</ul>
Love and belonging:
<ul>
<li>Basic analytics (e.g. page views, user engagement)</li>
<li>User authentication and authorization (e.g. sign-up, login, role-based access control)</li>
<li>User feedback (e.g. contact form, survey)</li>
<li>Social media integration (e.g. sharing, commenting)</li>
</ul>
Esteem:
<ul>
<li>Advanced analytics (e.g. user behavior tracking, A/B testing)</li>
<li>Performance monitoring (e.g. load testing, monitoring of server resources)</li>
<li>User experience optimization (e.g. user testing, usability analysis)</li>
</ul>
Self-actualization:
<ul>
<li>End-to-end testing (e.g. Selenium, Cypress)</li>
<li>Accessibility and internationalization (e.g. support for screen readers, translation)</li>
<li>Scalability (e.g. load balancing, caching)</li>
<li>Continuous integration and delivery (e.g. Jenkins, Travis CI)</li>
<li>Deployment (e.g. Docker, Kubernetes)</li>
<li>Automated testing (e.g. unit test, integration test)</li>
</ul>
Of course this list isn’t exhaustive, but I’ve been thinking about it as more of a checklist to build upon when working on small side-projects that end up getting significant attention and development time.


I was thinking about all the little projects I work on and how they grow over time. The applications end up hitting some milestones and end up needing similar functionality that compliments the core features. A small project ends up getting complex enough that it requires some unit tests. I’ll go to deploy the project and now I need some deployment scripts and analytics to ensure the application is running correctly. The technology may change between each project, but web applications always seem to have the same steps that need to be taken to strengthen the application as it is scaled up.

At a large company, adding a new set of functionality always has a suite of concerns to think through before implementation: how will we deploy this feature, how do we validate that users are using the feature like we expected them to, how do we monitor for bugs and errors? This is on top of the basic functionality of actually writing and testing that new feature.

What if we thought about this like Maslow’s Hierarchy of Needs, but in the context of a web application.

Maslow's Hierarchy of Needs is a psychological model of human motivation proposed by Abraham Maslow in 1943. The model describes a hierarchy of human needs, beginning with basic physiological needs such as food and shelter and progressing upwards to higher-level needs such as self-actualization. Maslow argued that as humans satisfy their basic needs, they can move on to satisfy their higher-level needs.

Applying Maslow's Hierarchy of Needs to web applications, we can identify the different levels of needs that need to be met in order to make a web application successful.

Basic functionality:

- A single build/run script
- Basic functionality (e.g. CRUD operations for a web app)
- User interface (e.g. layout, navigation, responsive design)
- Integration with external services (e.g. databases, APIs)

Safety and security:

- Linting (e.g. ESLint, Prettier)
- Unit tests (e.g. Jest, Mocha)
- Basic error handling and reporting (e.g. logging, alerting)
- Input validation (e.g. form validation)
- Security best practices (e.g. encryption, password hashing, session management)

Love and belonging:

- Basic analytics (e.g. page views, user engagement)
- User authentication and authorization (e.g. sign-up, login, role-based access control)
- User feedback (e.g. contact form, survey)
- Social media integration (e.g. sharing, commenting)

Esteem:

- Advanced analytics (e.g. user behavior tracking, A/B testing)
- Performance monitoring (e.g. load testing, monitoring of server resources)
- User experience optimization (e.g. user testing, usability analysis)

Self-actualization:

- End-to-end testing (e.g. Selenium, Cypress)
- Accessibility and internationalization (e.g. support for screen readers, translation)
- Scalability (e.g. load balancing, caching)
- Continuous integration and delivery (e.g. Jenkins, Travis CI)
- Deployment (e.g. Docker, Kubernetes)
- Automated testing (e.g. unit test, integration test)

Of course this list isn’t exhaustive, but I’ve been thinking about it as more of a checklist to build upon when working on small side-projects that end up getting significant attention and development time.


The Hierarchy of Webapp Needs