Статьи / Закладки / Профиль kahi4 / Хабр

Variable name @kahi4

Database administrator

Профиль Публикации 4Комментарии 1.7KЗакладки 151

asketoff 22 апр 2022 в 11:30

Упущенный импакт tNPS: потенциал, как основа ранжирования

6 мин

11K

Блог компании МТСВизуализация данных*

Привет, Хабр! Меня зовут Сергей Барановский, я руководитель проектов по аналитике МТС.

Сегодня поговорим о том, что такое NPS, чем упущенный импакт отличается от обычного и как он может помочь при расстановке приоритетов.

aio350 3 ноя 2021 в 08:41

Как работает React: подробное руководство

22 мин

46K

Блог компании Timeweb CloudВеб-разработка*ReactJS*JavaScript*

Привет, друзья!

В этой статье я покажу вам, с чего начинается React.

Что это означает? Это означает, что мы разработаем мини-версию React, которая сможет выполнять следующий код:

import '../style.scss'
import MyReact from './my-react'

const buttonStyles = {
 border: 'none',
 outline: 'none',
 padding: '0.3rem 0.5rem',
 marginLeft: '0.5rem',
 backgroundImage: 'linear-gradient(yellow, orange)',
 borderRadius: '2px',
 boxShadow: '0 1px 2px rgba(0, 0, 0, 0.2)',
 cursor: 'pointer'
}

/** @jsx MyReact.createElement */
function Counter() {
 const [value, setValue] = MyReact.useState(1)
 const [count, setCount] = MyReact.useState(1)

 return (
   <section>
     <h1 className='title'>Hello from MyReact!</h1>
     <div className='box'>
       <input
         style='width: 80px; padding: 0.15rem 0.5rem;'
         type='number'
         value={value}
         onInput={(e) => {
           setValue(Number(e.target.value))
         }}
       />
       <button
         style={buttonStyles}
         onClick={() => {
           setCount((count) => count + value)
         }}
       >
         Increment
       </button>
     </div>
     <h2 className='subtitle'>
       Count: <span className='count-value'>{count}</span>
     </h2>
     <ul className='list'>
       {['React', 'from', 'scratch'].map((item) => (
         <li>{item}</li>
       ))}
     </ul>
   </section>
 )
}

MyReact.render(<Counter />, document.getElementById('app'))

Как вы могли догадаться, наша версия будет называться MyReact.

Исходный код проекта.

Скриншот:

Песочница:

При разработке мы будем придерживаться архитектуры исходного кода React. Вместе с тем, следует отметить, что за последние 2 года исходный код React претерпел значительные изменения, поэтому некоторые вещи, которые мы будем рассматривать, помечены в нем как legacy. Несмотря на это, общие принципы и подходы остаются прежними.

Процессорный эксперимент в Токийском университете