Рассказ о своей домашней библиотеке

Голуб Светлана
Евгеньевна (учитель начальных
классов) ГБОУ ООШ №3 и Грифлюк Ирина Антоновна (школьный библиотекарь).

Урок литературного чтения во 2 классе УМК
«Школа России» по учебнику Л.Ф.Климановой.

Тема: Библиотека.

Цели урока: напомнить учащимся правила обращения с книгами; развивать у
них интерес к чтению, истории; продолжить формирование навыков связной речи,
выразительного чтения

Планируемые результаты:

Предметные: учащиеся должны представлять, что такое библиотека, для
чего она существует, уметь рассказывать о своей домашней библиотеке, а также о
той, которую они посещают. В чём её предназначение. Знать историю
создания книг и библиотек, какие типы библиотек бывают, что такое алфавитный
каталог и как им пользоваться.

Метапредметные:

Регулятивные: формулировать цели и  учебные задачи урока,
 планировать вместе с учителем деятельность по изучению темы урока;
выбирать в совместном обсуждении шкалу оценивания и предлагать критерии оценки
 выполнения будущих работ

познавательные: анализировать текст стихотворения

коммуникативные: отвечать на вопросы учебника на основе научно-
познавательной статьи, считывать необходимую информацию об истории
происхождения книги, с иллюстрации учебника, со слайдов презентации,
 разделять полномочия в группе при планировании проекта « О чём может
рассказать школьная библиотека».

Личностные: осознать пользу книг и чтения для себя, для своего
личностного роста. Обосновывать мотивы посещения библиотеки и выбора книг по
своему интересу.

Оборудование к уроку: учебник « Литературное чтение» (2 класс), компьютер с
мультимедийным проектором, карточки
с загадками, слова на доске (можно пользоваться магнитной азбукой),
зашифрованное название темы урока; выставка любимых книг.

Информация для учителя: Если есть возможность, то лучше этот урок провести в
библиотеке.

Ход урока.

I. Организационный  момент.

II. Речевая разминка.

— Учитель читает стихотворение. Кому оно посвящено? (Слайды
№1,2)

 Библиотекарь.

В мире, как в небе
звёздочек ясных,

Профессий и званий
не перечесть.

И среди
самых-самых прекрасных

Библиотекаря
звание есть.

Библиотекарь –
путеводитель

В самый загадочный
мир из миров.

Библиотекарь –
добрый хранитель 

Знаний и мудрости
целых веков.

Библиотекарь,
будто аптекарь,

Всегда вам
подскажет, что почитать.

Библиотекарь – душ
наших лекарь,

Его не возможно не
почитать.

Пастырь духовный –
библиотекарь –

Храма служитель
пресветлого книг.

Издревле зовёт
этот храм человека,

Чтобы он мудрости
силу постиг.

Средь всех даров
просвещённого века

Книга по-прежнему
лучший нам друг.

Библиотека лучше
аптеки:

Знания силою
крепок наш дух!

                                        Татьяна
Шувалова

— Как автор называет библиотекарей?

— Какими они ему кажутся?

— Чем ему представляются залы?

— Как автор говорит о книгах?

III. Актуализация знаний. Постановка целей урока.

— Ребята, а что вы можете рассказать о библиотекарях и
библиотеках?

— Какая тема сегодняшнего урока? О чём мы будем говорить?

— Сегодня на уроке мы поговорим с вами о библиотеках,
истории их создания,  узнаем о них много нового и интересного. А так же вспомним
о том, как появились книги. Поговорим о современной библиотеке и правилах
поведения в ней.

—
Посмотрите на доску и прочитайте что нового сегодня мы с вами узнаем: (Слайд
№3)

1. Узнаем:
   …
2. Научимся:
   …
3. Будем
   учиться: …

IV. Работа над
новым материалом.

Постановка
проблемного вопроса урока.

— Были ли вы
когда – нибудь в библиотеке?

— А знаете ли вы, что такое
 библиотека, когда библиотеки появились и какой путь прошли книги от
древних времён до наших дней? Хотите узнать? Тогда начнём.

— Откройте страницу 6 учебника,
здесь вы узнаете всё о библиотеках.

Чтение статьи о библиотеках.

Рассказ учителя о том, какие
 бывают библиотеки, о  библиотеках мира с показом слайдов. (Слайды
№4-9)

Работа в школьной библиотеке с
библиотекарем.

— Что такое библиотека? Какие условия необходимы для работы
библиотеки?

Издавна библиотека – это место, где
сохраняют информацию, накопленную людьми, и представляют возможность с этой
информацией ознакомиться.

— Как хранят информацию в
современной библиотеке? Как быстро найти книгу на нужную тему? Сейчас мы с вами
и узнаем.

Рассказ библиотекаря об алфавитном
каталоге и картотеке.

— Представьте такую ситуацию. Что вы
пришли в библиотеку, а там нет библиотекаря. Вам нужно найти книгу, что будете
делать?

— Для этого, ребята, есть алфавитный
каталог. На каждой карточке стоят фамилия автора каталогу. Также на каждой
карточке написан шифр (несколько цифр и букв), который указывает, где, в каком
месте и на какой полке стоит нужная книга. По этому шифру можно найти книгу на
нужной полке. Попробуйте это сделать, когда вы будете посещать библиотеку. Если
у вас не будет что-то получаться, то обязательно обратитесь к
библиотекарю. Сейчас на смену бумажному каталогу в современных библиотеках
приходит электронный каталог, который через специальную компьютерную поисковую
систему помогает читателю осуществлять поиск нужных источников.( наглядно
смотрим каталог и пробуем найти нужную книгу).

— А ещё, когда ты записываешься в
библиотеку, на тебя заполняют читательский формуляр, куда заносят все
необходимые сведения о тебе и твоих родителях. В этом формуляре ты будешь
расписываться за каждую взятую книгу. На руки тебе выдадут читательский билет.
Эти документы подтверждают твоё право на пользование данной библиотекой.

В библиотеке есть абонемент – это
место выдачи книг на дом. Там тебе предложат выбрать нужные книги и запишут их
в твой читательский формуляр, напомним о сроках возврата. Может оказаться так,
что нужная тебе книга есть в библиотеке всего в одном экземпляре. И тебе
придётся посетить читальный зал. Там ты сможешь не только прочитать редкие
книги, которые не выдают на дом, но и поработать со справочными изданиями
(словарями, энциклопедиями), полистать свежие номера газет и журналов.

— Давайте поговорим о правилах
поведения в библиотеке (работа с карточками) « Что можно делать в библиотеке, а
что нельзя!»

V. Закрепление материала

Разгадываем кроссворд (Слайд 10), можно дать как
домашнее задание.

Перечитывание статьи по абзацам. Ознакомление с темами
проектов, планов выполнения проектов.

 VI. Рефлексия

-Выберите и продолжите любое предложение

 1. На сегодняшнем уроке я узнал…

 2. На этом уроке я похвалил бы себя…

 3. После урока мне захотелось…

 4. Сегодня я сумел..

VII. Итоги:

— Для чего создавались библиотеки?

— От каких слов произошло слово «библиотека»?

— Где появились первые библиотеки?

— Какие библиотеки считаются первыми?

— Кем была создана библиотека в III веке до н.э.?

— Кто такой Птолемей, чем он прославился?

— Поднимите руки те, у кого дома есть библиотека.
Расскажите, кто в семье у вас любит собирать книги. Какие книги чаще попадают в
вашу домашнюю библиотеку? Есть ли в вашей библиотеке место для детских книг?

VIII. Домашнее задание: подготовка проекта « О чём может рассказать
школьная библиотека».

eliace
24 октября 2021 в 11:52

На дворе октябрь, в npm залита новая версия фреймворка Chorda 3.0. Можно, наконец, устроиться поудобнее за чашечкой кофе и подвести некоторые итоги

Про сам фреймворк можно почитать здесь, посмотреть тут и пощупать там

В прошлый раз я рассказывал о дизайн-функции, чертежах и построении API компонентов, а в этот раз попробую заинтересовать вас некоторыми очевидными решениями и не очень очевидными следствиями, которые появились во время работы с Chorda

Очевидные решения

Когда я использую другие библиотеки, есть ряд вещей, которые меня не устраивают. Всегда казалось, что можно сделать лучше.

Расширение библиотечных компонентов

Начну с декларативного подхода и примесей — краеугольного камня Chorda. Для наглядности нам понадобится немного кода.

Создадим простой компонент на JSX (React) с кнопкой и текстом. Задача: при клике по кнопке меняется текст

const MyComponent = () => {

	const [data, changeData] = useState('')

	const hahdleClick = (e) => {
		changeData('Hello')
	}

	return <div>
  	<button onClick={handleClick}>Click me</button>
  	<p>{data}</p>
	</div>

}

// вот так выглядит применение компонента
<MyComponent/>

Сделаем похожий функционал, используя чертеж Chorda

// вырожденная дизайн-функция
const MyComponent = () => {
    return {
        templates: {
            button: {
                tag: 'button',
                text: 'Click me',
                events: {
                    // обработка событий VDOM
                    $dom: {
                        click: (evt, {data}) => {
                            data.$value = 'Hello'
                        }
                    }
                }
            },
            text: {
                tag: 'p',
                reactions: {
                    // реакции компонента на изменение переменной скоупа
                    data: v => patch({text: v})
                }
            }
        },
        initials: {
            // инициализация переменной в скоупе
            data: () => observable('')
        }
    }
}

// создаем чертеж
MyComponent()

Ну, все. Расходимся, ребята. Очевидно же, что шаблонный синтаксис намного проще и понятнее.

Но

Давайте посмотрим, что происходит с нашим JSX компонентом дальше. Итак, мы выполнили задачу, и теперь передаем наши наработки коллеге, скажем, в составе корпоративной или публичной библиотеки. Через некоторое время от коллеги приходит просьба: хочу, чтобы компонент можно было стилизовать. Не вопрос. Самый простой и быстрый способ это сделать — дать возможность управлять классом корневого компонента через пропсы.

Поехали

// Придется залезть в библиотеку (!) и сделать пару правок

const MyComponent = (props) => {

    const {rootClassName} = props

    /* Тут ничего не меняется. Пропускаем */

    return <div className={rootClassName}>
        <button onClick={handleClick}>Click me</button>
        <p>{data}</p>
    </div>
}

// рендерим
<MyComponent rootClassName="custom" />

Отлично!

Тем временем в Chorda

// Менять оригинальный чертеж необходимости нет

// В месте применения создадим примесь
mix(MyComponent(), {
    css: 'custom',
})

Естественно, стилизацией обычно дело не заканчивается. Чем дальше, тем больше хотелок и тем больше пропсов нам понадобится добавить.

На самом деле подобные извращения следует пресекать в зародыше, и сразу предоставлять возможность потребителю «слотировать» вложенные компоненты. Однако, в нашем примере компоненты оказались жестко связаны state-параметром data. Просто так вытащить их не получится, поэтому посмотрим, во что может превратиться реализация с пропсами

const MyComponent = (props) => {

    const {rootProps, buttonProps, text: MyText} = props

    /* тут ничего не меняется */

    return <div {...rootProps} >
        <button onClick={handleClick} {...buttonProps} >Click me</button>
        <MyText>{data}</MyText>
    </div>
}

<MyComponent 
    rootProps={{className: 'custom'}} 
    buttonProps={{className: 'custom-button'}}
    text={props => <p className="custom-text">{props.children}</p>}
    />

В ситуации с чертежом без особых именений

// Расширяем примесь
mix(MyComponent(), {
    css: 'custom',
    templates: {
        button: {
            css: 'custom-button'
        },
        text: {
            css: 'custom-text'
        }
    }
})

Для React типовое решение проблемы это вынесение состояния из компонента. Получившийся «глупый» компонент уже не будет иметь внутри сильной связи и позволит легко «слотировать» вложения. Но здесь есть подводный камень. Архитектура такая штука, что если где-то убыло, то где-то прибыло. Выбрасывая сложность из наших компонентов мы ее копим в другом месте, а именно там, где компонент будет применяться

Стоит признать, с примесями тоже не все так гладко. Чтобы сделать хорошо расширяемый компонент, его необходимо сильно декомпозировать, а это напрямую влияет на производительность и восприятие кода в целом (по второму пункту полезно почитать о причинах появления setup во Vue 3)

Так к чему все это сравнение? Тот же React может предложить много вариантов и подходов для расширения функционала, один экзотичнее другого. Chorda же предлагает один путь (на самом деле нет), что на мой взгляд экономит на выборе уйму времени

Этот компонент мне не подходит

Идем дальше. Мы рассмотрели как именно выполняются изменения отдельного компонента, но что если вы являетесь не автором библиотеки, а ее потребителем, и столкнулись с проблемой нехватки функционала или дефектом?

Тогда на выбор:

1. Делаем форк, вносим в него правки. Делаем PR в репо библиотеки. Пока ждем влития, пользуемся форком

2. Делаем свой компонент. Используем его вместо библиотечного. Ждем новой версии библиотеки

3. (для обладателей особого дара убеждения) Объясняем автору библиотеки в чем он не прав и почему он должен внести нужные вам правки как можно скорее. Профит!

4. Забиваем

Если вы используете Chorda, то у вас появляется еще один вариант: подмешать свой функционал к чужому компоненту. В этом случае компонент как-бы продолжает оставаться частью оригинальной библиотеки, но в то же время содержит нужные вам изменения

Mount или не Mount?

Наверно, правильнее этот вопрос надо задать так: в какой момент должна начинаться обработка бизнес задач?

Хорошо проиллюстрирует мою мысль пример с загрузкой данных в store приложении при открытии страницы. Как правило, загрузка выполняется по событию монтирования узла виртуального DOM, что есть странно — зачем что-то добавлять в DOM, если данных еще нет? Почему бы нам сначала не загрузить данные, а потом решать — рендерить что-то или нет. Тут ситуацию немного спасает Suspense и понятие асинхронных компонентов, когда у каждого из них есть своя отложенная задача и, соответственно, отложенная отрисовка

Мне же больше нравится вариант, когда загрузка вообще никак не связана с рендерингом. В Chorda бизнес-логика находится на уровне дерева компонентов, а результаты выполнения бизнес-задач влияют только на store/state, не касаясь отрисовки напрямую

Все мы вместе и каждый сам по себе

В Chorda состояние компонента определяется скоупом (что-то вроде локального store). Компонент видит только свой скоуп и работает только с ним, считая, что вокруг никого нет. Это позволяет спокойно выполнять смешивание, не опасаясь сломать жесткие связи между компонентами

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

Здесь мы подходим к такой штуке, как конвейер обработки (вычисление-патч-отрисовка). Он, как и любое другое значение, попадает к компонентам через скоуп, и его, так же как и любое другое значение, можно настроить локально. К примеру, стратегия базового конвейера дает построение дерева компонентов в ширину с удержанием задач отрисовки до окончания обработки всех патчей. Если для вашего компонента или блока компонентов такое решение не подходит, вы можете подключить к ним свой кастомный конвейер

Неочевидные следствия

А вот некоторые моменты не являлись изначальной целью, но проявились по мере развития фреймворка

Встраивание в существующие проекты

Реализация виртуального DOM не входит в состав Chorda, т.к. разработка еще одного нового отрисовщика не решала моих проблем. Поэтому я собирался использовать какой-нибудь из уже существующих. Для того, чтобы попробовать Chorda в деле, я собрался переписать с нуля пару домашних React-проектов. Но приступив, почти сразу понял, что это совсем не обязательно. Можно постепенно заменять отдельные компоненты, подключив правильный рендерер, и так потихоньку съесть всего слона целиком.

Интересный вопрос: если фреймворк использует React, то можно ли сказать, что приложение, которое использует данный фреймворк, написано на React?

Загружаем и работаем

Сомнительное следствие конечно, но для некоторых может оказаться чрезвычайно важным. Создание компонентов и отрисовка присходят в runtime, без этапа транспиляции. Подключив ядро Chorda и рендерер, можно сразу писать код, который тут же будет исполняться в браузере.

Правда вот, SSR превратился в нетривиальную задачу

Поведенческие компоненты

Тут скорее интересное наблюдение. Раньше я сталкивался только с таким подходом к «глупым» компонентам: есть простой компонент без логики работы, который знает как ему рисоваться, затем поверх него создается «умный» компонент, который включает в себя «глупый», добавляя некоторое поведение.

Так вот в Chorda (из-за того, что можно легко менять порядок смешивания) у меня появился набор компонентов, в которых есть только поведение без правил отрисовки (обычно это набор стандартных реакций). И получилось, что, наоборот, уже к поведению начинает примешиваться способ отображения

Как это может выглядеть:

export default () => {
    // поведенческий компонент Text
    return Text({
        as: Paragraph, // "глупый" компонент Paragraph
        text$: $ => $.user.name
    })
}

Что в итоге?

Естественно, это не все, о чем хотелось рассказать. Но к этому времени кофе уже закончился, а статья на две чашки это уже лонгрид. Смотрите примеры, читайте доки, оставляйте отзывы.

Если фреймворк вас заинтересовал, или у вас есть предложения по его развитию — всегда пожалуйста.