232 Matching Annotations
  1. Jun 2025
  2. Aug 2024
  3. Jan 2024
    1. Noise

      Noise is anything interfering with clear communication; distractions that occur during communication that resolves in misinterpretation.

      Internal noise: psychological or physical problem someone is dealing with during communication

      External noise : Environmental components that cause distraction

      Semantic noise: a disturbance in the transmission of a message; interferes with interpretation of the message due to words having more than one meaning.

      A connotation: positive or negative emotional connection to a definition. connotative semantic noise is more of an emotional issue with the intended use of words.

      Denotation: the literal meaning of a word; denotative semantic noise: when we hear or see language we cannot define therefore we cannot interpret.

  4. Aug 2023
  5. Mar 2023
  6. Dec 2022
  7. Nov 2022
  8. Oct 2022
  9. Aug 2022
  10. Apr 2022
  11. Jan 2022
  12. Jul 2021
  13. May 2021
  14. Apr 2021
  15. Mar 2021
    1. First of all, I would say it is not good to use margin on the component’s top-level, because it breaks the isolation of components.// A React component with margin set on top-levelconst MyComponent = () => { return <div style="margin: 1rem">...</div>;};margin here is not just affecting the component itself, but also affecting other components (e.g., it is pushing off another component / element sitting next to it)If we want to place this component in a different context or layout, margin would get in the way of resuse

      当然ながら、コンポーネントのトップレベルでマージンを使うことは次の2つの理由から良くない。

      • コンポーネント外の他のコンポーネントに影響を与えてしまう。(例えば、位置を変えてしまうなどの副作用)
      • 他のレイアウトやコンテキストでコンポーネントを再利用しづらくなってしまう
  16. Feb 2021
    1. One of the main reasons to work with components is re-usability and portability, but also a delegation of responsibilities. Adding a component should be as easy as simply adding the component without having to know the inner workings (or markup) of this component. A consumer should only be aware of the properties, methods and events of a component. In order to style a child component one has to be aware of the markup as well, which violates this 'delegation of responsibility'-principle.
    1. To give a little more context, structures like this often come up in my work when dealing with NoSQL datastores, especially ones that rely heavily on JSON, like Firebase, where a records unique ID isn't part of the record itself, just a key that points to it. I think most Ruby/Rails projects tend towards use cases where these sort of datastores aren't appropriate/necessary, so it makes sense that this wouldn't come up as quickly as other structures.
  17. Jan 2021
    1. Theemergence of the termcontent strategyitselfrepresents widespread recognition that componentcontent management was in great need of aroadmap.

      For me this is one of the key sentences of this paper. It is impossible to understand content strategy without taking component content management into consideration. For an academic approach to content strategy component content management is a key.

  18. Dec 2020
    1. What is a data-originated component? It’s a kind of component that is primarily designed and built for either: displaying, entering, or customizing a given data content itself, rather than focusing on the form it takes. For example Drawer is a non data-originated component, although it may include some. Whereas Table, or Form, or even Feed are good examples of data-originated components.
    1. Sometimes, systems just scale the problemA UI design system is more than the code of a component library. It’s more than the colors, styles, and margins of your elements. It’s an ever-growing and ever-evolving creature that entails your brand and your user’s feelings.

      If you don't understand the problem - you can [[scale the problem instead of solve the problem]], and it's important to remember that a [[design system is more than a component library]]

  19. Nov 2020
    1. It's been a while since I had to write a typeahead without RxJS but this took some time and a lot of code. The implementation also contained fewer features, as the cancellability of previous requests. Sadly, most of the time, the implementation also introduced bugs. But with RxJS, this becomes trivial. By using some RxJS operators we end up with a working typeahead, without the bugs, which is thoroughly tested, and has more features. All of this, with less code.
  20. Oct 2020
    1. // Make a HOC
      // This is not the only way to accomplish auto-save, but it does let us:
      // - Use built-in React lifecycle methods to listen for changes
      // - Maintain state of when we are submitting
      // - Render a message when submitting
      // - Pass in debounce and save props nicely
      export default props => (
        <FormSpy {...props} subscription={{ values: true }} component={AutoSave} />
      );
      
  21. Sep 2020
    1. I took the same approach with _layout.svelte and not just for the svelte-apollo client. Except I put all of that setup into another module (setup.js) and imported from _layout. I just couldn't stomach having all that code actually in my _layout file. It's for layout, supposedly, but it's the only component that is a parent to the whole app.
    1. Most simple example: <script> import ChildComponent from './Child.svelte'; </script> <style> .class-to-add { background-color: tomato; } </style> <ChildComponent class="class-to-add" /> ...compiles to CSS without the class-to-add declaration, as svelte currently does not recognize the class name as being used. I'd expect class-to-add is bundled with all nested style declarations class-to-add is passed to ChildComponent as class-to-add svelte-HASH This looks like a bug / missing feature to me.
    1. The problem with working around the current limitations of Svelte style (:global, svelte:head, external styles or various wild card selectors) is that the API is uglier, bigger, harder to explain AND it loses one of the best features of Svelte IMO - contextual style encapsulation. I can understand that CSS classes are a bit uncontrollable, but this type of blocking will just push developers to work around it and create worse solutions.
    1. Svelte will not offer a generic way to support style customizing via contextual class overrides (as we'd do it in plain HTML). Instead we'll invent something new that is entirely different. If a child component is provided and does not anticipate some contextual usage scenario (style wise) you'd need to copy it or hack around that via :global hacks.
    2. Explicit interfaces are preferable, even if it places greater demand on library authors to design both their components and their style interfaces with these things in mind.
    3. The RFC is more appropriate because it does not allow a parent to abritrarily control anything below it, that responsibility still relies on the component itself. Just because people have been passing classes round and overriding child styles for years doesn't mean it is a good choice and isn't something we wnat to encourage.
    1. The point of the feature is to not rely on the third-party author of the child component to add a prop for every action under the sun. Rather, they could just mark a recipient for actions on the component (assuming there is a viable target element), and then consumers of the library could extend the component using whatever actions they desire.
    1. It’s become increasingly common to divide code into components, rather than by file type. React, for example, allows for the collocation of a components markup and JavaScript. In Svelte, this is taken one logical step further: the Javascript, markup and styling for a component can all exist together in a single `.svelte`​ file
  22. Aug 2020
  23. Jul 2020
  24. Jun 2020
  25. May 2020
  26. Apr 2020
  27. Mar 2020
  28. Dec 2019
  29. Nov 2019
    1. The idea is that the additional prefix _ of a Null Component symbolizes that it adds even less to the DOM than an Injector. I picture the name falling through to become just the _, like the unused argument convention in javascript functions: const handleEvent = (_, id) => { console.log(id) } .
    1. However, in this case you would lose the possibility to render something in between. You are strictly coupled to the higher-order component's render method. If you need to add something in between of the currency components, you would have to do it in the higher-order component. It would be quite similar as you have done it previously by rendering the currency components straight away in the Amount component. If using a render prop component instead, you would be flexible in your composition.
  30. Oct 2019
  31. Sep 2019
    1. You can control the following props by providing values for them. If you don't, react-select will manage them for you. value / onChange - specify the current value of the control menuIsOpen / onMenuOpen / onMenuClose - control whether the menu is open inputValue / onInputChange - control the value of the search input (changing this will update the available options) If you don't provide these props, you can set the initial value of the state they control: defaultValue - set the initial value of the control defaultMenuIsOpen - set the initial open value of the menu defaultInputValue - set the initial value of the search input

      Example of having props for both ways: value or defaultValue, depending on whether you want it to be controlled or not.