Постнагуализм

Демо Игры на Phaser 3 (https://phaser.io) и  javascript, здесь, на сервере ПостНагвализма.


Большая часть из них курсовые и учебные проекты Codecademy (https://www.codecademy.com)

Поймай Крота Раскопателя! (http://forum.postnagualism.com/js/Mole_Unearther/index.html)

Электро-Мышь и Битва с Лысым Психованным Котом! (http://forum.postnagualism.com/js/Electric_Mouse/index.html)

Раскраска - Перекрась Пегаса! (http://forum.postnagualism.com/js/Color_a_Pegasus/index.html)

Охотник за Сокровищами! Откопай три Золотых монеты бастрее чем Пират! (http://forum.postnagualism.com/js/Treasure_Hunter/index.html)

Нравится Музыка? Можно поклацать по клавишам онлайн Пианино! (http://forum.postnagualism.com/js/piano_keys-main/index.html)

Бесконечный прыжок Коди! Бесконечная Лестница в Небеса! (http://forum.postnagualism.com/js/Codey_Jump3/index.html)



А это по официальному уроку от создателей Phaser 3

Звезды с Небес! Платформер (http://forum.postnagualism.com/js/Platformer/index.html)




_________________________________________________________

Работаю  над версткой веб страницы (домашнее задание)

Нужно создать с нуля веб страницу для компании или фирмы.
Для фирмы,  настоящей или придуманной используя только css flex.
(Пока без сетки css grid)

Задание, что бы страница хорошо смотрелась на разных гаджетах : на телефоне, планшете и экране компьютера. Что бы тянулись элементы, уменьшались и увеличивались с размером.
Чтоб там была  галерея продуктов, и чтоб галерея эта на телефоне - выстраивалась картинками в длину. А на широком экране, что бы картинки становились в ширину.

Короче что бы они занимали доступное на экране место, а не прятались под слайдер.

Используется в создании только Css и html.
Требование не использовать css grid,
работать только используя flex для адаптивности ( тянучести).

Готовая работа ложится в портфель ( портфолио),  как в личное ( по желанию), так и в портфель  профиля академии (обязаловка).


Во всю идет подготовка к финальным экзаменам, повторяем пройденный материал.

Скрины в процессе  - "проблемные" места на разных экранах.
Вижу там буква вылезла за контур в заголовке, на самом узком экране (телефон).

Это решается позже, контролем над шрифтами на разных экранах с помощью css - @media

Ссылок меню - пока нет, вставлю в шаблон позже. Они водят по длине этой страницы, по темам и обратно вверх к заголовку.

А клик по картинкам галлереи - переводит на страницу (не существующую пока) конкретно этого продукта.
Их появление не зависит от меня. Поэтому пока ссылки (картинки с домиками) открывают пустую страницу.

Осталась еще пара блоков и можно сдавать.

Ну вот, работа закончена и сдана.
Ее можно посмотреть в живую, а так же все исходные коды в репозитории GitHub
Ссылки и описания заданий в переводе приложу позже.
https://mtapirina.github.io/flexbox_business_site/

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

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

Это проект страницы для клуба, какого нибудь вымышленного или настоящего клуба по интересам.
Это может быть клуб йоги или клуб любителей шахмат, кошек и т.д.
Или наприме клуб любителей бега, или.... клуб любителей мотопробежек или дайвинга..

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

Нырять мы ездили по многим побережьям Испании, и за границу ( Коста Рика, Египет  и т.д.).

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

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

Так что веб страница клуба наверняка будет страницей посвященной тому клубу, это решено!

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

Две контрольные ( практические работы созданные с нуля ) сдала.
Теперь экзамен.. 2 части, каждая по часу.
Проходной балл 75% ..

Ссыль и скрины на вторую страницу с адаптивным дизайном позже закину ( растягивающимся и  разработанным для устройств с разной шириной экрана)....

Немного выдохлась.. это похоже на гонку ;)  как втягиваюсь - не могу остановиться! Очень интересно! Ну и результаты радуют, само собой..
Ведь с полного нуля учу..

Yes!! Прошла!

Переходим к следующему разделу - front-end.
Причем 18% этого раздела уже пройдено, так как контент входил в " основы веб разработки", то есть в предыдущий базовый уровень.
Это отчасти html и css.
Ну а новый раздел открывает принцесса Java Script  ;)

Ох чувствует мое сердечко, намучаюсь я с ней..
Ну а пока  самое начало оч похоже на C # , все те же переменные,  методы, операторы..
Даже коментируется так же...
Хотя есть и различия. В Си шарпе не особо любят кемалКейс из за сложности потом для прочтния программистом, а вот в джава скрипте он кажется в почете.
Покрайней мере пока что это так.
Мне же больше нравится добавлять слова через тире. И вводя переменные не использовать большие буквы. Что бы отличать переменные от методов и функций, встроенных или созданных..

     Может быть не через тире, а через подчеркивание? А то обычно тире/дефис используется в языках программирования, как оператор вычитания.

Pipa, А я вот, возьму, и не ляпну ничего! А почему? Да, потому, что я ничего в этом не понимаю.
 Попытайтесь быть похожими на меня. Это вас спасёт.

Да, нижнее тире.. ____  подчеркивание.

Хотя мне думается способ наименования переменных -  дело привычки.
Тем более когда только учишься своих привычек еще не выработалось..
В конце концов пишешь как те у кого учишься.

Пока самые азы. И они очень похожи на С#.
Немного проще в том смысле, что задавая переменные не обязательно скурпулезно указывать ее тип. Достаточно указать, константа или нет..  можно пропустить ; в конце, и код прокатит.. в шарпе сразу ошибку выкинет.

Пока что все очень миленько. Хотя - одна голая консоль.
Самое прикольное было упражнение по пересчету своего возраста в ... собачий ! ;)

Вообще видно, что с юмором ребята...

Пипу ? От чего?

Соня (Bruja), от зашквара, однако. Она часто пишет глупости пытаясь быть экспертом во всем.

Pipa знает более дюжины языков программирования, так кому же, как не ей, поддержать разговор на эту тему?

Соня (Bruja), Pipa, да этим вонючим программированием только зрение убивать. Ботанички, а оно вам надо?

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

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




Ссылка на репозиторий второго задания:
там все документы. index.html   styles.css. , можно просмотреть код.

https://github.com/mtapirina/responsive-club-website

внешний вид - страницы в живую
https://mtapirina.github.io/responsive-club-website/

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

Upd

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

     Мыслить логически программирование едва ли научит, тут скорее обратная зависимость - неумеющие мыслить логически не могут научиться программированию :).
     Но по большому счету логическое мышление не столь обязательно, сколь желательно развивать в себе антиживотные :) понятия и способности. Вот положим, что вы выучили какой-то другой иностранный язык. Слова там другие, но понятия по большей части те же самые - бытовые. И это обстоятельство не изменится, сколько бы иностранных языков вы ни выучили. Другое дело - язык программирования, в котором "животных" понятий нет совсем. Т.е. нет ничего из сфер ощущений и чувств. Чего стоят хотя бы такие термины, как абстрактные классы и виртуальные функции :).

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

имхо

В языке понятий нет животных.. Но они есть и сильны в нас..

Ну и для нас есть очень "животный" плейграунд, песочница-личный кабинет. Он достаточно красочен и тут же видишь результат.. то есть визуальный вывод того, что ты там насобачил.
Без визуалки я никак.. животное во мне сильно.. хищник! ну и страсть к власти.. код и результат полностью мне подчинены. И это кайф.. А вот когда не получается то, чего хочу получить - готова мышку швырять в монитор.. очень злюсь. Но быстро остываю,  потому что не понятно на кого.. ведь код писала я сама.. А как можно злиться на саму себя?
ЧСВ рулит!
 ;D

(ванильные программисты ныне... не то что старая школа полных аутистов...)

Массивы оч похожи на си шарповские.
Циклы тоже...
Такое дежавю..
Кроме не строго типизированных объявлений переменных пока не вижу сильных отличий..
Функции тоже записываются похоже.

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

Но до него еще далеко. Пока синтаксис базовый жуем.
Так приятно, оказывается я не забыла то, что курсах по си шарпу учила.
Вот честно, в основном и яснее всего, происходит параллель с теми уроками c# где в итоге игра с Лисенком получалась.
Это ведь не просто уроки как игру создать , а именно обучение кодированию на си шарп, очень наглядное.

Так что эти темы буквально пробегаю, по сравнению с html и css.
Но и разница конечно, в javascript, как впрочем и в c#  база намного шире..
То есть наверно можно сравнить с css+html  вместе взятых.
А то и побольше. Если библиотеки внешние вклюсить.
Уж с какой то нам точно придется работать.. пока просто node js подключили на своих компах.
Благо на маке терминал bash , тестить можно консольные приложения прямо в нем или в нем, но  через VS Code.
Хотя в окне браузера все же удобнее.

Про животное в нас.
Или про Массивы в программировании.

некогда меня просто завораживало слово аррай, порой слышимое от друзей программистов ..
Представлялось что то такое.. ммм.. охренительное , прям ни словами описать ни в сказке рассказать..  звездно ванильное...
Помню как меня постигло разочарование, когда на курсах по си шарпу эту таинственную и завораживающую  структуру буквально унизили, скинув с неба в грязь... обозвав " просто списком". Листом.
Блинн.. даже слыша русский вариант слова, "массив" - создавался некий монументальный образ не вполне понятно чего.. но такой... возвышенный..
А тут, список. Перечень.
Меня как водой холодной окатили...
Никогда не называю массивы или array " перечнем". Это так.... унизительно для какой то части моего сознания, возведшей массивы на пьедистал.
Вернее этой части моего сознания буквально претит так унижающе небрежно обращаться с тем, что она возвысила и одухотворила, с тем, что вдохновляло полет ее воображения.

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

Одномерный массив похож на линию выложенных в ряд коробок с каким то содержимым. Ящики  по порядку пронумерованы

Двойной вложнный массив - на несколько улиц, на карте ( типа вид сверху).
Располагается уже в двумерном пространстве.

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

 Какой же это нахрен " список"?

Именно МАССИВ!  Ну или плюшевое слово Array. А те учителя просто дураки. Вот,
 ;)

Пипа, как
можно к массиву применить за раз два итератора?

Мне что то в голову никак не приходит. А то, что приходит дает ошибку.

Это возможно вообще?

    Итераторами я никогда не пользовалась :), а всегда просто "вручную" перебираю элементы массива в цикле for (которых друг в друга можно вкладывать до бесконечности). Итераторы - принадлежность языка C#, хотя в C++ они тоже есть, если вместо массивов заводить контейнеры.
    И вообще у меня склонность к "нижнему уровню" (т.е. наиболее близкому к уровню инструкций процессора), да и большинство операторов языка C/C++ я понимаю в смысле того, что они на нижнем уровне делают. Например, массив для меня - это [базовый] адрес памяти, начиная с которого вверх по возрастанию расположены однородные элементы, которые можно достать по адресу, полученному прибавлением к базовому адресу необходимого смещения, зависящего от номера элемента в этом массиве. Именно для этого прошу компилятор параллельно выдавать мне ассемблерный листинг того, что он накомпилировал. Это в последствии помогает мне трассировать/отлаживать программу в кодах процессора. Однако я ни в коей мере не стану советовать кому-либо поступать так, как я, т.к. это занятие исключительно для любителя (которым являюсь я из-за своей склонности к нижнему уровню). Потому и язык C люблю за его максимальную близость к процессорному уровню (многие операторы этого языка являются прямыми аналогами инструкций процессора). По той же причине люблю с микроконтроллерами возиться, т.к. там нижний уровень можно непосредственно "пощупать руками".

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

А я потому от С и ему подобных глубинных языков -  отказалась. Просто не представляю, что я бы с ними могла делать. Драйвера писать?  Виндоус в нуля? Вот если бы я в техотделе каком работала бы.

Наша задача будет связывать сайт с серверной частью, отправлять данные и получать их. Типа того же логина для входа в свой аккаунт на форум или сайт. И подобного рода вещи, нужные для front-end.

Мы изучали сейчас методы итерации для массивов в JavaScript.
то есть все эти методы - .reduce(), .filter(), .map(), forEach()..

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

А мы перетасовываем и отфильтровываем шмотки, вещи, деньги цвета и прочие значения, типа правда или ложь, цифры, знаки, слова ...

 и возвращаем - иногда объект с кучей свойств взятых из изначального массива.
Иногда - новый массив, с отфильтрованными данными.
Иногда - проверяем вообще стоит ли фильтр применять, соответствует ли его условию хоть один элемент массива..

Это уже более "животные" абстракции :)

Типа исскуственный отбор .
    Пипа размышляет об том же самом   но аналоговым методом .

     forEach() мне тоже приходилось использовать, только итератором я его не называла, т.к. он сильно похож на мой любимый for :).
     Я ведь в программировании самоучка, а потому по части терминологии не сильна. Для меня важно (и это запоминается), какая конструкция что делает. Например, forEach для меня и есть forEach :), даже если у него есть еще какие-то названия, отличающиеся от имени.

Кстати да, их не всегда выделяют в отдельную группу (особенно на русскоязычных рессурсах).
Чаще - подают в контексте темы о "высших функциях" (higher order function) тех, что принимают функции в виде параметра и/или отдают как результат,
 и о функциях "с обратным вызовом "- callback function. Тех, которые используют уже как аргумент, при вызове другой функции (очевидно первого типа).

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

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


// здесь оцениваем дистанцию и выдаем соответствующий комментарий:

const howClose = (distance) => {
if (distance > 100) console.log("Скоро прибываем... ");
else console.log("Нам еще ехать и ехать.");
}

//Здесь
//1 -рассчитываем саму дистанцию,
//2-  передаем полученное значение в какую то функцию, как параметр,
//для последующей обработки:

const calculateDistance = (speed, time, callback) => {
    const distance = speed * time;

    callback(distance);
}

//Здесь - вызываем функцию рассчета дистанции,
//передаем аргументы - скорость и время,
// и в виде функции для третьего параметра - передаем  howClose, написанную ранее (которая собственно и оценит рассчитанную дистанцию, а потом выдаст соответствующий комментарий.  

calculateDistance(40, 2, howClose);
//Нам еще ехать и ехать.

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

проще ведь в одну функцию все это воткнуть, и, если надо,  менять оценку (значения комментариев, определенных как переменные где то во вне, в глобальной области)..


не доходит концепт...
просто запоминаю, что вот, и так значит можно извратится. но к чему это практически - пока не доходит..

Может быть ты знакома с этими приемчиками? Для чего это все ? как применяется?
наверняка они используются очень часто, иначе нас не гоняли бы так по пустякам...

UPD//
Вот что меня смутило и в ступор ввело -  слово distance




и тут,



по чему то наивно решила, что это обязательная фишка, протащить  параметр неизменным по обеим функциям..

проверила изменив

calculateDistance = (speed, time, callback) => {
    const dist = speed * time;

    callback(dist);
}

--

работает так же..

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

типа подошел кондуктор и проверил по быстрому билеты, если не сделал этого пока дистанция была  меньше 100...

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

Да, я ведь за этим и зашла, ссылку кинуть на интересный проект для самообучения на GitHub.
там много практических заданий в конце. Чисто для тренировки (мы( Codecadrmy пока что на дне 9 как вижу.. )

https://github.com/Asabeneh/30-Days-Of-JavaScript/tree/master

вот то что переведено на русский (не знаю, все перевели или еще в процессе)

https://github.com/Asabeneh/30-Days-Of-JavaScript/blob/master/RU/README.md

Вступление

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

Задача 30DaysOfJavaScript - руководство для начинающих и опытных разработчиков JavaScript. Добро пожаловать в JavaScript. Мне нравится использовать и преподавать JavaScript, и я надеюсь, что вы это сделаете. JavaScript - это язык браузера.

В этом пошаговом руководстве вы изучите JavaScript, самый популярный язык программирования в истории человечества. Вы используете JavaScript для добавления интерактивности на веб-сайты, для разработки мобильных приложений, настольных приложений, игр, и в настоящее время JavaScript можно использовать для машинного обучения и AI. JavaScript (JS) вырос в популярности в последние годы и был ведущим языком программирования в течение четырёх лет подряд и является наиболее используемым языком программирования на Github.

Требования
Для выполнения этой задачи не требуется предварительное знание программирования. Вам нужно только:

Мотивация
Компьютер
Интернет
Браузер
Редактор кода


Задача «30 дней программирования на JavaScript» — это пошаговое руководство по изучению языка программирования JavaScript за 30 дней. Это испытание может занять более 100 дней, просто следуйте своему собственному темпу.

 These videos may help too: https://www.youtube.com/channel/UC7PNRuno1rzYPb1xLa4yktw

    Так оно и есть :). Полагаю, что всё это выкрутасы коучей, вознамерившихся продемонстрировать все тонкости языка. Тогда как в практических целях словоупотребление на всех языках неравномерно - какие слова/выражения используются часто, какие-то реже, а какие-то за всю человеческую жизнь ни разу не произносятся. А когда такие слова вдруг встречаются в тексте, приходится у Google спрашивать, что они означают, например, слова "вирпил" и "кокпит" :).
     Кстати, что за язык ты изучаешь? Откуда эти примеры с коллбэком? Неужели это Javascript? - Не узнаю его!
На Javascript функции определяются через ключевое слово "function", что невозможно забыть. Например так:
function howClose(distance)
{ if (distance > 100) console.log("Скоро прибываем... ");
   else console.log("Нам еще ехать и ехать.");
}

function calculateDistance(speed, timek)
{ distance = speed * time;
   howClose(distance);
}

Но можно и через коллбэк вторую функцию вызвать, если так хочется:
function calculateDistance(speed, time, callback)
{  const distance = speed * time;
    callback(distance);
}

     Лично я пишу без коллбэков, а порой даже чураюсь вкладывать одну функцию в другую, предпочитая вызывать их по очереди. Типа сначала вычислить дистанцию молча, а следом за ней вызвать "распечатку" результата.
     Однако коллбэки бывают нужны, когда не ты сама вызываешь эту функцию в своем коде, а когда эта функция вызывается автоматом по ситуации. Например, если пользователь нажимает какую-то кнопку на клавиатуре или кликает мышью в каком-то месте страницы. Тогда обработчик событий разберется с тем, какому символу принадлежит нажатая клавиша или выяснит, по какому элементу страницы пришелся клик мышью. А поскольку обработчик не знает, что потом с этим делать, то вызовет "самописную" callbаck-функцию, где я укажу, что надо с этими символами делать - обычно строю из них строку, а после конца строки (клавиша  Enter) разбираю ее синтаксис. Особенно это актуально, когда обработчик писала не я (т.е. когда он является библиотечной функцией). А так же часто применяется для обработки ошибок, когда у функции возникают затруднения с выполнением порученного ей задания. Например, ей поручено что-то прочитать в файле с заданным именем, а его на диске не оказалось. В этом случае callback может как абортировать задачу, так и подыскать этому файлу замену.

Да, это Javascript, но современный. Хотя и старый вариант тож работает.

Можно сокращенно некоторые функции писать, стрелками =>
( Если они, стрелки  не внутри метода, вызывающего объект. Метод, в котором   придется упомянуть сам объект  как this. Стрелки этого this не видят как надо, и получаются ошибки (они  лезут в поисках этого объекта в глобальную область)

Думаю это с ES6  ввели. Нам же позволено писать как угодно. Но сами они в своих примерах прибегают к новому синтаксису, где это возможно.
Я  часто и сама пишу через

 function (param, param){ .
тело функции и return ..;
} ;

Эти же стрелки ввели и C#. Но я ними не пользовалась.


Ну да, для приведенного примера так кажется проще и логичнее.

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

  Меня поразило, что в JavaScript нет приватности для класса ,объекта  или переменной..

Это как же получается?  Это не опасно ?


Понятно. Точно нам их раньше времени втюхивают.. хотя очевидно, что потом они действительно будут нужны. И не для рассчета дистанции ;)

Спасибо!

Пра forEach() - не только меня поставило в небольшой ступор задание контрольной (или челенджа, конкурса, как его называют на сайте академии).
Мы то понимаем, как работает этот метод, да и на MDN - forEach (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/forEach)
есть полное описание и самого метода и как с ним работать.

Однако, непонятки с заданием возникли не только у меня, так как к странице с заданием прикрепили ссылку на тему форума, открытую недовольными учениками, закидавшими админку вопросами и претензиями (вы нас этому не научили. Не понятно чего вы хотели, пишите  задание более внятно и т.д.).

Сейчас приведу задание в переводе на русский (оригинал на англ):

Напишите функцию:
declineEverything(),
которая принимает массив строк и, используя .forEach(), перебирает каждый элемент массива и
вызывает   politelyDecline() для каждого из них.
Функция .forEach() должна напрямую применять politelyDecline();
он НЕ должен просто получать функцию аргумента, которая использует politelyDecline().
Вы можете протестировать свою функцию, когда будете готовы, передав ей массив овощей или создав собственный массив!

Нам дано:
//массив:
const veggies = ['broccoli', 'spinach', 'cauliflower', 'broccoflower'];

//функция, которую нужно вызвать через .forEach() :

const politelyDecline = (veg) => {
      console.log('No ' + veg + ' please. I will have pizza with extra cheese.');
};


// Write your code here:




--


Ну и все или многие поголовно написали - как нас учили (было на занятиях и часто повторялось) - callback функции вызывать. То есть, чем запесочили мозги.

Жмешь на кнопочку  проверить - и О Ужжжас!!
Тест не пройден!
Открываем вкладку с подсказкой (мы то думали что просто, как семечки... и в нее не заглянули ранее)...
И что там видим?


подсказка :
Если вам нужно освежить знания о .forEach(), ознакомьтесь с этим упражнением и документацией MDN.
Ваша функция должна иметь параметр массива. Вы вызовете forEach() для переданного массива.
Каким должен быть ваш аргумент для функции forEach() ?
Обратите внимание, что мы хотим, чтобы politelyDeclined() передавался непосредственно в качестве аргумента .forEach()

Here’s an example of code that WILL NOT pass our tests:
Вот пример кода, который НЕ ПРОЙДЕТ наш тест:

const declineEverything = arr => {
  arr.forEach(element => politelyDecline(element));
}

[/color]
У многих честно говоря ступор произошел. Потому что именно так мы все и написали. Как на уроках и никак иначе..
Стрелками или обычным способом - воткнули вызываемую функцию подобным образом.

И можно перерыть ссыль на MDN приведелнную выше - вы там не найдете какого то иного способа, воткнуть вызываемую функцию как то иначе... потому что практически все примеры написаны вот в таком стиле :

первый же пример который вам выдаст страница :
const array1 = ['a', 'b', 'c'];

array1.forEach((element) => console.log(element));

// Expected output: "a"
// Expected output: "b"
// Expected output: "c"

где console.log() - вызываемая callback функция( функция обратного вызова)..

Только на страницах форума академии по теме именно этого теста - многие из нас поняти, чего от нас требуется..
что то такое :

function declineEverything(arr) {
    arr.forEach(politelyDecline);
}


Ну и далее - пояснение, нам непонятливым:

politelyDecline — это переменная, указывающая на функцию. Это значит, что
strArray.forEach(politelyDecline);
равен вот этому:
strArray.forEach((veg) => {console.log(‘No ’ + veg + ’ please. I will have pizza with extra cheese.’});

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

"на самом деле мне трудно понять эту логику, и объяснение, похоже, не прояснило мою путаницу, и я надеюсь на некоторую дополнительную ясность.
Я понимаю, что переменная «politelyDecline» была передана в .forEach() в качестве аргумента, но «politelyDecline» — это функция, которая сама принимает один аргумент. Когда он был передан в качестве аргумента .forEach(), мы не передавали ему никаких аргументов.
Более того, как к нему передавался каждый «овощ» (из массива), если ему передавалась
 только функциональная переменная?
Именно это меня озадачивает, и чтение документации MDN не проясняет мне ситуацию, поскольку этот пример использования, похоже, не обсуждается.
Синтаксис, который я бы использовал, который был неверным для этого примера, согласно тексту в вопросе, был: «strArray.forEach(veg => politelyDecline(veg));»
Этот синтаксис имеет для меня смысл, поскольку .forEach анализирует один «овощ» из массива и использует обратный вызов politelyDecline, передавая ему каждый «овощ» в качестве параметра.
Если кто-то сможет лучше объяснить, как это работает, мы будем очень признательны."

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

из документации : "Печать содержимого массива
Примечание. Чтобы отобразить содержимое массива в консоли, вы можете использовать console.table(), который печатает отформатированную версию массива.
Следующий пример иллюстрирует альтернативный подход с использованием forEach().
Следующий код регистрирует строку для каждого элемента массива:"

 - что никак не соотносится у нас с заданием и их претензиями к коду. Никакого упоминания, что тут какая то "прямая" передача функции, которую от нас требуют.

JS

const logArrayElements = (element, index /*, array */) => {
  console.log(`a[${index}] = ${element}`);
};

// Notice that index 2 is skipped, since there is no item at
// that position in the array.
[2, 5, , 9].forEach(logArrayElements);
// Logs:
// a[0] = 2
// a[1] = 5
// a[3] = 9

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

"Итераторы, такие как Array.forEach(), имеют собственную внутреннюю переменную-итератор. Обратный вызов должен быть только ссылкой на объект функции. Итератор обрабатывает вызов функции один раз для каждого значения в массиве.
Когда он был передан в качестве аргумента .forEach(), мы не передаем ему никаких аргументов."


Вот честно, мне яснее не стало. Как это никогда не передаем, если передавали постоянно, передавая функцию как callback?
Далее, на подобныей вопросы - чел ответил:

"а так вы еще не проходили классы Javascript?
Это прояснит вам по поводу встроенной в вызываемый класс функциональности...
Ну подождите немного, вот пройдете и вам все станет понятно !"

Тут все и присели молча....

Нормально да?
:)

Я бы сразу написала:
veggies.forEach(politelyDecline);
и не мучилась со стрелками.

Нам начинающим не понятно, почему НЕ пишется аргумент, который у вызываемой функции есть.

politelyDecline(тут ведь требуется анрумент?)

Как он передается в функцию если мы его не указали?

и чей то комментарий о том же..

ЗЫ- классы мы еще не проходили, нам сказали, как пройдем, так все нам станет ясно..

    Потому что forEach() заполняет параметры указанной в нем функции по умолчанию:
1) Если у функции 1 параметр, то forEach() впендюрит в него значение элемента масива.
2) Если у функции 2 параметра, то forEach() впендюрит в первый параметр функции значение элемента массива, а во второй параметр - его индекс (порядковый номер в массиве).
3) Если у функции 3 параметра, то forEach() заполнит первые два параметра так, как в случае двух параметров, а третьему параметру присвоит имя массива (его адрес).
    Учитывая эти его особенности, программист подставляет ему функцию со столькими параметрами, сколько ему нужно дополнительной информации (чаще всего востребована информация об индексе, т.к. имя массива обычно бывает заранее известно, но и оно может понадобиться, если поиск ведется последовательно по нескольким массивам с одной и той же вызываемой функцией).

СПАСИБО, если бы нам вместо стрелок начали бы объяснения с этого, дополнив потом коллбеками с аргументами -  то вопросов и затыков не возникло бы.

как бы ты написала функцию, вычисляющую Факториал натурального числа n ?
на Javascript само собой..

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

function factorial(n){

if(n === 0 || n === 1){
    return  1;
}else if (n < 0 || !Number.isInteger(n)){
    return 'n - must be a real non-negative integer';
}else{
    return n * factorial(n-1);
}
}

//console.log(factorial(5));

    К сожалению тут я не могу похвастаться своим умом :), т.к. раньше уже знала, что факториал вычисляется рекурсивно. Где-то так:
function factorial(n)
{
  if (n == 1) return 1;
  return n * factorial(n-1);
}

     А сталкивалась я с этим при необходимости вычисления "сочетаний (https://www.matburo.ru/tvart_sub.php?p=calc_C)". В теории вероятностей они применяются (распределение Пуассона) и для вычисления биномиальных коэффициентов (мне для полиномов эти коэффициенты были нужны). И хотя там в формуле сразу три факториала, эти факториалы численно тоже никто не считает, а используют рекурсивную формулу:
function C(n, k)
{
    if (k==0 || k==n) return 1;
    return C(n-1,k-1) + C(n-1,k);
}

Этот момент был самым сложным для меня... додуматься что там factorial(n-1); а не просто (n-1).
Я чуть не повесилась.. а потом решила погуглить.. нашла у одного парня и обалдела.. Пыталась себе это в уме представить.. Заглючило меня на долго, потом бросила.. долго золотые круги на темном фоне перед глазами стояли.. (никаких допингов не нужно..)
мне такой финт ушами просто в голову не пришел бы.. я его просто НЕ могу представить. У меня какой то зеркальный бесконечный коридор появляется в уме..
как это внутри функции вызвать саму же  эту функцию, хотя она еще не дописана... не дала результаты.. то есть в процессе..




Совершенно не поняла, как ею пользоваться. Подставила переменные - жалуется, что нет доступа. Поставила цифры- молчит. Вызвала функцию с числами ввиде параметров - она молча повесилась... ну страница веб.

 ;D  Сначала я, наивная,  хотела ей скормить массивы, что бы на сочетания полюбоваться, но нет, она не приняла, ошибку выдает. Потом создала объекты, вложила в каждый 3 ключа- значения.. ничего..

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


То есть получаешь - сколько возможных сочетаний меж таким количеством объектов двух типов? трех?

126
это чего? картинка ниже.


Сайт и вправду крутой!!! Спасибо за ссылку!
А это прям по нашей тематике, кастанедовской...
Какова вероятность что вы встретите нагваля? вот, рассчитайте блин !

А - встречу Нагваля, как некогда Кастанеда и стану магом.
В  не встречу Нагваля, не стану магом, потому что встречу любовь своей жизни!!! единственную мою (от имени парня воина)
Где P - вероятность видимо.. а А и В события.
 :D


Теорема о сложении вероятностей. Вероятность появления одного из двух несовместных событий равна сумме вероятностей этих событий.

P(A+B)=P(A)+P(B).
Теорема об умножении вероятностей. Вероятность произведения независимых событий А и В вычисляется по формуле:

P(A⋅B)=P(A)⋅P(B).

Из последнего, на чем они (академики ) проели нам плешь в своем тесте --

задание:

Напишите функцию justCoolStuff(), которая принимает два массива строк и с помощью встроенного метода .filter() (https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Array/filter) .
Возвращает массив с элементами, присутствующими в обоих массивах.
Вы можете протестировать свою функцию, когда будете готовы, передав массивы myStuff и coolStuff или создав собственные массивы!

// Write your code here:  // Разместите ваш код тут:



// то что дано- два массива и вызов нашей функции:

const coolStuff = ['gameboys', 'skateboards', 'backwards hats', 'fruit-by-the-foot', 'pogs', 'my room', 'temporary tattoos'];

const myStuff = [ 'rules', 'fruit-by-the-foot', 'wedgies', 'sweaters', 'skateboards', 'family-night', 'my room', 'braces', 'the information superhighway'];

console.log(justCoolStuff(myStuff, coolStuff))
// Должно напечатать новый массив со значениями, общими для обоих массивов :
[ 'fruit-by-the-foot', 'skateboards', 'my room' ]



Надо учесть, что мы проходили некоторые встроенные методы, но ни одного, который помог бы прямо и просто решить задачу - сравнения элементов в двух массивов:

.forEach(), .filter(), .map(), .findIndex(), .reduce(), .some(), .every(), .find()...

Что делать?
Самое ... подходящее из представленного, на мой взгляд:

Метод indexOf() (https://developer.mozilla.org/ru/docs/Web/JavaScript/Reference/Global_Objects/Array/indexOf) возвращает первый индекс, по которому данный элемент может быть найден в массиве или -1, если такого индекса нет.

Параметры:
searchElement
Искомый элемент в массиве.

fromIndex
Индекс, с которого начинать поиск.


Ну чтож, будем притягивать за уши..


const justCoolStuff = (arr1, arr2)=>{      // функция, принимающая 2 массива
    let newArr = [];         //пустой массив, что бы впихнуть одинаковые значения
    let duplicates = arr1.filter(element => {   //применяю .filter, фильтрую элементы
        if(arr2.indexOf(element) > -1){    // ! -1 это когда похожего объекта нет
           newArr.push(element);    // втолкнуть найденное значение в пустой массив
        }
     });

    return newArr; //венруть новый массив, собранный из одинаковых для обоих массивов элементов
}


И ура!!! тест пройден!

С любопытством открываю ПОДСКАЗКУ и...
Опаньки..

Здесь может оказаться полезным встроенный метод Array .includes(), но вы можете использовать цикл! Дополнительную информацию о методе .includes() можно найти в документации Mozilla Developer Network (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes).
Если вам нужно освежить знания о .filter(), ознакомьтесь с нашим упражнением по JavaScript в дополнение к документации Mozilla Developer Network (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/filter).

Вот ведь козлы!!
Я извелась вся, пока вымучала из себя нечто приличное,  а тут - такую нужную штуку нам открывают во время теста.. А не на уроке.. Слов просто нет..

Метод includes() (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)определяет, содержит ли массив определённый элемент, возвращая в зависимости от этого true или false.

Посмотрите, как просто и элегантно выглядит код с использованием .includes()


const justCoolStuff = (arr1, arr2)=>{
    let duplicates = arr1.filter(element => arr2.includes(element));

    return duplicates;
}

А можно сократить еще, вот до такого !(это я уже на форуме  подсмотрела... )
Не одну меня этот тест вымучал, хотя конечно большинство просто открыло подсказку сразу... я же как пионер, вечно намучаюсь и только потом  если уж совсем никак - к подсказкам прибегаю...
Но конечно, не я одна такая. Иначе бы форум опустел..

const justCoolStuff = (arr1, arr2) => arr1.filter(item => arr2.includes(item));

какая красота!
(не удержалась и сохранила себе на память  ;D)

Соня (Bruja), при всём уважении к познаниям Пипы, chatGPT знает почти всё о JavaScript и о любом другом языке программирования. Да и код пишет на уровне примерно джун+. То есть, может залагать, но под чутким руководством способен на многое.

GPT это бредогенератор. Ваще ниочём. Дурацкий поисковик для малолеток, гордо называемый "интеллектом".  В энциклопедии нефти и газа https://www.ngpedia.ru/ можно найти более чистую инфу без косяков и ошибок, которым так грешит GPT

Хрен там практики повыше! Сразу после одного теста (на знание джаваскрипт уровень intermediante)= Эти проверочные тесты - Practice intermediate JavaScript concepts with these 3 code challenges....
Благо - мой ответ - там с факториалом - сохранился.. вот радость  ;)

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

Ну и конечно, одного из методов просто необходимых для решения задачи - мы не проходили. Но нас с непреодолимым упорством прямо толкают самим рыскать  в  в документации Mozilla Developer Network (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/includes)
и находить то, что нужно..

Думаю что эти козлы - не такие уж и козлы, просто у них такая стратегия.. Они УЧАТ НАС УЧИТЬСЯ!, причем не только у них, но вообще у всех и источника в том числе..(ну не даром они там и обучение машин преподают.. и нас видимо так же как машины или компы.. или как тот же chatGPT муштруют)

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

Но лезть в ответы раньше, чем найдешь решение сам- путь слабака..
по имху

Любуйся: :)

(http://forum.postnagualism.com/images/Strike.png) (http://forum.postnagualism.com/images/Strike.png)


В моей программе число объектов задается пользователем - это величина Gap в окне параметров. А на этом рисунке она равна 512 (т.е. числу точек на рисунке по координате X). А количеством сочетаний я никогда не интересовалась, т.к. они являлись не самоцелью, а использовались в дальнейших вычислениях.

научите как с помощью Javascript вызвать командную строку(на удалённом компе в.т.ч.)

Красота!!
 хотя не совсем поняла, для чего программа используется, что с ее помощью рассчитывают?

Что это за синусоиды разноцветные?
(Gap это зазор пробел, пропуск?)


 ЗЫ нет мы пока в такие абстрактные дебри не заглядываем..
Сейчас пишем программку, для проверки кредиток по предоставленному номеру.
Потом сортировка негодных кредитов из массива с номерами карт в отдельную кучу ( массив). И распознание, к каким компаниям те бракованные номера относятся ( Master Card, Visa Electron,  American Express)...
Типа чтоб компании оповестить и передать фальшивые номера им.

Ерунда конечно, это же просто урок. Но понятно че и для чего делаем. А в твоей программе я вообще то ничего не понимаю.. полная загадка!

А тебе зачем?

Лучше уж alert() - выскакивает в браузере окошко с предупреждением .. или угрозой!!! Типа сейчас ваш комп будет отформатирован  ;)

А консоль для js - только в параметрах песочницы будет доступна. Тем более на чужом компе.
Это в браузере можно напакостить.. считать пароли, личные данные, номера кредиток..
Но на комп врят ли воздействовать получится. Для этого программа должна быть установлена пользователем. То есть быть самостоятельной программой, а не встроенным аплетом как джаваскрипт.
Или как трояны - клиентская часть в компе у клиетов, а у тебя серверная часть. Ниче не портит, сидит незаметно, но собирает информацию.. ну может ресурсы  компа использовать.. например для рассылки спама с него...

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

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

Зеркала? Фаерволы? Защита вшитая и обновляемая в операционку?

А ты думаешь почему трояны в старое время рассылали по эл почте?
Пока не откроешь письмо, или не кликнешь по ссылке клиентская часть трояна не загрузится на комп - клиент.
А теперь и в почте антивирусы стоят, почту нашу читают прежде чем мы ее откроем..

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

Наверно способы есть. Но очевидно это не так просто, как было раньше))

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

Это было весело  ;D
Правда не мне, а ребятам, которые потом вирусню вычищали.. я им так надоела видимо, с переустановками, что они мне дарили диски с операционками и прогами и драйверами, и научили самой лов форматить с диск.. ставить операционку, устанавливать программы нужные мне для работы. А так же устанавливать сломанные программы ( помню была одна, стоила 6000$ оригинал, 3d maya версии 3...чтоб ее установить, даже взломанную, приходилось еще те танцы с бубном проделывать..
А фотошоп 2 кстати стоил 700$ оригинал.. а мы и знать не знали. У всех стоял ломанный, купленный на базаре за пару тугриков   ;)
Сейчас он в бесплатном доступе на сайте Адоба с ключами к нему..

По сути то о чем я и писала в теме про развитие разума.. противостояние с потенциальным врагом заставляет человека развиваться.. а его разум эволюционировать..

    Собственно, как язык, Javascript умеет делать всё, но та его реализация, которая встроена в браузер, специально "кастрируется" - очень многое ей запрещается делать ради безопасности. Т.е. если бы браузер предоставлял возможность внешнего управления клиентским компьютером, то эта была бы дыра в браузере, а компания, выпустившая такой браузер в свет, по ныне действующему международному законодательству пошла бы под суд. Поэтому браузерный Javascript способен оперировать только на страницах документа, который этим браузером открыт и не распространяется на другие. Например, если у вас в браузере открыты два сайта: личный кабинет банка, откуда вы можете распоряжаться своим банковским счетом, и другой сайт со "зловредным" JS-кодом, то последний никакого доступа на банковский сайт иметь не будет. Короче говоря, браузерный Javascript используется в весьма ограниченных целях, хотя по своему синтаксису и возможностям это вполне полноценный язык.

    В этом контексте мой вопрос к Соне: каким интерпретатором языка Javascript вы пользуетесь? А точнее - на каком интерпретаторе вас тренируют на этих курсах?

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

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



На чем пишем в личном кабинете? В браузере?
Это их собственный интерпретатор, он встроен в страницы с уроками в личном кабинете.
Написан на javascript  и react native. Они сами хвастались..ну не то что бы хвастались, но упоминали неоднократно, в контексте курсов по JS.
Для меня, лично,  за строками и словами упоминаний, это звучало, как замануха, типа вот будете умничками, выучите javascript хорошо,  и вы такую классную штуку сможете создать..  это действительно возможно!!!
Коуч, как ты и говоришь...
Не знаю, понадобится ли мне вообще когда нибудь такую штуку создавать, скорее всего нет. Но это так обалденно!!! Это как предложить стать божком браузерной песочницы...
 ;D
Я купилась конечно ))

А домашки ( на своем компе ) я пишу на vs code обычно.  Тот что синенький.. не фиолетовый

     Интерпретатор не может интерпретировать сам себя :). Положим они написали Javascript'а на его же собственном языке. Ну и на чем этот код запускать? Курица не может родить сама себя.

В одном из старых ответов на форуме академии (за 2013 год) нашла, но ссыль устарела..
It’s Ace-editor http://ace.ajax.org

Насколько понимаю - этот опенсорсный онлайн редактор Ace взят за основу.
Наверно раскрасили и поддержку языкам дописали.
На сайте академки - он не работает вживую. Надо нажать кнопку "сохранить".
Тогда и получаешь результат проверки.

https://ace.c9.io

гугла -
Ace — встраиваемый редактор кода, написанный на JavaScript. Он соответствует функциям и производительности родных (нативных) редакторов, таких как Sublime, Vim и TextMate. Его можно легко встроить в любую веб-страницу и приложение JavaScript. Ace остается основным редактором Cloud9 IDE и является преемником проекта Mozilla Skywriter (Bespin).

Пипа может его можно тут на форум прикрутить? Вот красота будет!!! Или он совсем "сырой" и много мороки?


//
Еще нашла рассуждения на тему  как оно обрабатывает JS код (перевела гуглой.
может брехня, я в этом ниче не понимаю)

https://www.quora.com/What-is-the-technology-stack-behind-Codecademy-How-does-it-process-JavaScript-code-thats-written-by-students

Внешний интерфейс:

HTML5, новые теги, такие как <header> и <footer>, но поддержка устаревших браузеров тщательно сохраняется.
Используется Javascript, jQuery. Сама консоль основана на плагине jQuery под названием jq-console (https://github.com/amasad/jq-console).
Обработка входного Javascript: Не похоже, что у них есть интерпретатор, написанный с нуля, а скорее рассчитывают на то, что Javascript браузера интерпретирует входные данные, а затем захватывает выходные данные.
Определение правильности ввода: страница загружается с переменной excercisionData, которая содержит отдельные упражнения с тестовыми примерами Javascript, которые выполняются на основе результатов обработки пользовательского ввода. Таким образом, корректность вопроса определяется на стороне клиента. После того, как пользователь нажимает «ввод» в консоли, выполняется POST-запрос, содержащий вводимые пользователем данные и информацию о том, удовлетворен ли он конкретным упражнением.

Back end:

Rails running on nginx + varnish
MongoDB for persistence
Standard AJAX for client - server communication

про проверку кредитных карточек по их номерам, напишу попозже.
Не нравится мне одна из функций, которую написала... думаю, как бы ее покрасивше и короче переписать..
хотя для конкурса важна только функциональность. Говорят рефракцией кода займетесь позже, главное чтоб  правильно работала.
Да потом надо закинуть на Git hub, хотя кому такая хрень нужна в портофолио? там совершенно не на что смотреть..

//Конкурсный проект: проверка кредитных карт
//Challenge Project: Credit Card Checker
// Мое решение на gist.github:
//https://gist.github.com/mtapirina/41c32800b7a452f516b7090933dc3e58 (https://gist.github.com/mtapirina/41c32800b7a452f516b7090933dc3e58)
//https://gist.github.com/codecademydev/db9f766146d5000a2dcf526e247b879a (https://gist.github.com/codecademydev/db9f766146d5000a2dcf526e247b879a)

// Все действительные номера кредитных карт
const valid1 = [4, 5, 3, 9, 6, 7, 7, 9, 0, 8, 0, 1, 6, 8, 0, 8];
const valid2 = [5, 5, 3, 5, 7, 6, 6, 7, 6, 8, 7, 5, 1, 4, 3, 9];
const valid3 = [3, 7, 1, 6, 1, 2, 0, 1, 9, 9, 8, 5, 2, 3, 6];
const valid4 = [6, 0, 1, 1, 1, 4, 4, 3, 4, 0, 6, 8, 2, 9, 0, 5];
const valid5 = [4, 5, 3, 9, 4, 0, 4, 9, 6, 7, 8, 6, 9, 6, 6, 6];

// Все недействительные номера кредитных карт
const invalid1 = [4, 5, 3, 2, 7, 7, 8, 7, 7, 1, 0, 9, 1, 7, 9, 5];
const invalid2 = [5, 7, 9, 5, 5, 9, 3, 3, 9, 2, 1, 3, 4, 6, 4, 3];
const invalid3 = [3, 7, 5, 7, 9, 6, 0, 8, 4, 4, 5, 9, 9, 1, 4];
const invalid4 = [6, 0, 1, 1, 1, 2, 7, 9, 6, 1, 7, 7, 7, 9, 3, 5];
const invalid5 = [5, 3, 8, 2, 0, 1, 9, 7, 7, 2, 8, 8, 3, 8, 5, 4];

//Может быть действительным или недействительным
const mystery1 = [3, 4, 4, 8, 0, 1, 9, 6, 8, 3, 0, 5, 4, 1, 4];
const mystery2 = [5, 4, 6, 6, 1, 0, 0, 8, 6, 1, 6, 2, 0, 2, 3, 9];
const mystery3 = [6, 0, 1, 1, 3, 7, 7, 0, 2, 0, 9, 6, 2, 6, 5, 6, 2, 0, 3];
const mystery4 = [4, 9, 2, 9, 8, 7, 7, 1, 6, 9, 2, 1, 7, 0, 9, 3];
const mystery5 = [4, 9, 1, 3, 5, 4, 0, 4, 6, 3, 0, 7, 2, 5, 2, 3];

//Массив из всех массивов выше
const batch = [valid1, valid2, valid3, valid4, valid5, invalid1, invalid2,invalid3, invalid4, invalid5, mystery1, mystery2, mystery3, mystery4,mystery5];

//Мои массивы для тестирования
const test = [4, 5, 3, 9, 6, 8, 9, 8, 8, 7, 7, 0, 5, 7, 9, 8];
const test1 = [4, 5, 3, 2, 7, 7, 8, 7, 7, 1, 0, 9, 1, 7, 9, 5];
const test2 = [6, 0, 1, 1, 1, 2, 7, 9, 6, 1, 7, 7, 7, 9, 3, 5];


//неверное первое число — 9 — для проверки «Компания не найдена»
const test3 = [9, 0, 1, 1, 1, 2, 7, 9, 6, 1, 7, 7, 7, 9, 3, 5];
//неверный пакетный массив (массив из массивов с неверными номерами карт
const batchInv = [ invalid1, test3, invalid2,invalid3, invalid4, invalid5];

/*Создайте функцию validateCred() , которая имеет параметр массива. Цель validateCred() — вернуть true, если массив содержит цифры действительного номера кредитной карты, и false, если он недействителен. Эта функция НЕ должна изменять значения исходного массива.*/

function validateCred(array){
/*шаг 1 — Удалить последний элемент из массива,
(но помните: вы не хотите изменять исходный массив!):*/
const arr = array.slice();//copy of array
//console.log((array === arr) + '  copy of array');
let checkDigit = arr.pop();//Remove the last element from the array
//шаг 2 — Переверните массив (теперь без последней цифры):
const reverseArray = arr.map((_, index) =>
    arr[arr.length - 1 - index]);
/*Шаг 3. Умножьте цифры в нечетных позициях.
(например, первая цифра, третья, пятая и т. д.) на 2.
Если полученное число больше 9, вычтите 9 из числа:*/
let sum = 0;
for (let i = 0; i < reverseArray.length; i++){
    let x = reverseArray; // currentIndex
    
    if(  i % 2 === 0 ){
        x *= 2;
        x > 9?x -= 9:x;
    }
    sum += x;
}
/*Шаг 4. Сложите все числа в массиве, а также пропущенную цифру из шага 1. Если сумма по модулю 10 равна 0 , то массив содержит допустимое число: */
return (sum + checkDigit) % 10 === 0? true : false;
};

/* Создайте еще одну функцию findInvalidCards() , имеющую один параметр для вложенного массива номеров кредитных карт.
Роль findInvalidCards()  — проверить во вложенном массиве недопустимые числа и вернуть другой вложенный массив недействительных карточек.
*/

function findInvalidCards(array){
const invalidCards = array.filter((element) => !validateCred(element));
return invalidCards;
};


/*5
Создайте функцию idInvalidCardCompanies() , которая имеет один параметр для вложенного массива недопустимых чисел и возвращает массив компаний.
В настоящее время существует 4 принятые компании, каждая из которых имеет уникальные первые цифры.
3   Amex (American Express)
4   Visa
5   Mastercard
6   Discover
Если номер не начинается ни с одной из перечисленных цифр, распечатайте сообщение типа: «Компания не найдена».
idInvalidCardCompanies() должен возвращать массив компаний, которые разослали карты с недопустимыми номерами. Этот массив НЕ должен содержать дубликатов, т. е. даже если есть две недействительные карты Visa, Visa должна появиться в массиве только один раз.
*/


function idInvalidCardCompanies(array){

const pushArr = [];

array.forEach((el)=>{
    //console.log(el[0])
        switch(el[0]){
            case 3:
            if(pushArr.indexOf('Amex (American Express)')=== - 1){
                pushArr.push('Amex (American Express)');
               }
            break;
            case 4:
            if(pushArr.indexOf('Visa')=== - 1){
                pushArr.push('Visa');
               }
            break;
            case 5:
            if(pushArr.indexOf('Mastercard')=== - 1){
                pushArr.push('Mastercard');
               }
            break;
            case 6:
            if(pushArr.indexOf('Discover')=== - 1){
                pushArr.push('Discover');
               }
            break;
            default:
            if(pushArr.indexOf('Company not found')=== - 1){
                pushArr.push('Company not found');
               }
            break; };
    })

  return pushArr;
};

/*extra:
Чтобы проверить номера кредитных карт, создайте функцию, которая принимает строку и преобразует ее в массив чисел, подобный изначально предоставленным массивам.*/
function convertToNumbersArray (string){
//преобразовать строку => в массив символов
    let x = Array.from(string);
     console.log(x);
//новый массив чисел => преобразовать символы в числа
    const toNumbersArray = x.map(el =>{
        let toNum = parseInt(el);
        return toNum;
        
       });
       //если элемент нового массива NaN?
       const validNumbers = toNumbersArray.some(el=>
         Number.isNaN(el));
       //console.log(validNumbers);

        //console.log(toNumbersArray);
     if(!validNumbers){
        return toNumbersArray;
     }else{
    return 'Wrong number of Credit Card. This function accepts only numbers!'
     }
};


//Преобразовать недействительный номер кредитной карты в действительный

function convertToValidCard (array){
    const arr = array.slice();// копия исходного массива
    let lastDigit = arr.pop(); //удалим последнюю цифру из arr и сохраним ее в переменной lastDigit
    //console.log(lastDigit);
    //console.log(arr);
    //применить обратный цикл к массиву arr (к копии урезанного номера кредитной карты)
    let sum = 0;
    for(let i = arr.length - 1; i >= 0; i--){
        let x = arr;
        if(i % 2 === 0){
            x *= 2;
            x > 9? x -= 9:x;
        }
        //console.log(x)
        sum += x;
      
    }
    //console.log(sum + ' sum');
    //console.log(lastDigit + ' - last digit');
    let result = sum + lastDigit;
    //console.log(result + ' - result');
    
    if(result % 10 !== 0){
       let y = Math.round(result/10)* 10;
       //console.log(y + ' - result round 10%');
       if(sum % 10 === 0){
        lastDigit = 0;
       }else{
       lastDigit = y - sum;
       }
       //console.log(lastDigit + ' - last digit changed');
       arr.push(lastDigit);
    }else{
        return 'This Credit Card is valid. Please insert invalid Credit Card number'
    }
    //console.log(arr);
    return arr;

};



// test
//console.log('test2(invalid) convert to valid cc number');
//console.log(convertToValidCard(test2));
//console.log(validateCred(convertToValidCard(test2)));
//console.log('parse Int - new array of integers');
//console.log(convertToNumbersArray ('49161591k0658210'));
//console.log('batchInvalid - Company not found =>');
//console.log(idInvalidCardCompanies(batchInv));
//console.log('batch - id Invalid Card Companies =>');
//console.log(idInvalidCardCompanies(batch));
//console.log('batch - findInvalidCards(8) =>');
//console.log(findInvalidCards(batch));
//console.log('batchInvalid - findInvalidCards(6) =>');
//console.log(findInvalidCards(batchInv))
//console.log('test true - validateCred =>');
//console.log(validateCred(test));
//console.log(validateCred(test2));
//console.log(validateCred(valid1));
//console.log('test false - validateCred =>');
//console.log(validateCred(convertToNumbersArray ('3542403720469485746')));
//console.log(validateCred(invalid1));
//console.log('test mystery (false = 2, true = 3) - validateCred =>');
//console.log(validateCred( mystery5));


Возможно, все это можно сделать как то короче и красивее... Но я в принципе довольна и тому что у меня получилось.
Работает вроде бы правильно, по крайней мере мне ошибки удалось исправить и больше они не повторялись..
Вообще этот конкурс мне очень понравился! По ходу поиска решений узнала кое что новое.. Например как округлять до десятка ближайшего с помощью Math.round(var/10)* 10;
или о том, что копию - дубликат массива быстро и просто можно сделать  так
const arr = array.slice(); и при проверке - это именно другой масив, а исходный останется не тронутым.
О проверке Number.isNaN() - существует ли число, или его нет (нет никакого значения) и т.д.

И вот новое задание  на радость Пипе... про ДНК! :)  (конкурсная работа)

Загадочный организм

Обзор
Этот проект немного отличается от других, с которыми вы до сих пор сталкивались на Codecademy. Вместо пошагового руководства этот проект содержит ряд открытых требований, описывающих проект, который вы будете создавать. Существует много возможных способов правильно выполнить все эти требования, и вам следует рассчитывать на использование Интернета, Codecademy и других ресурсов, когда вы столкнетесь с проблемой, которую не можете легко решить.

Цели проекта
Контекст: вы являетесь частью исследовательской группы, которая обнаружила новый загадочный организм на дне океана возле гидротермальных источников. Ваша команда называет этот организм Pila aequor (P. aequor) и обнаруживает, что он состоит всего из 15 оснований ДНК. Небольшие образцы ДНК и частота, с которой она мутирует из-за гидротермальных источников, делают P. aequor интересным экземпляром для изучения. Однако P. aequor не может выжить над уровнем моря, а найти P. aequor в глубоком море сложно и дорого. Ваша задача — создавать объекты, имитирующие ДНК P. aequor, для изучения вашей исследовательской группой.
 :)

(Project Goals
Context: You’re part of a research team that has found a new mysterious organism at the bottom of the ocean near hydrothermal vents. Your team names the organism, Pila aequor (P. aequor), and finds that it is only comprised of 15 DNA bases. The small DNA samples and frequency at which it mutates due to the hydrothermal vents make P. aequor an interesting specimen to study. However, P. aequor cannot survive above sea level and locating P. aequor in the deep sea is difficult and expensive. Your job is to create objects that simulate the DNA of P. aequor for your research team to study.)

     На счет вычислительной части проекта я едва ли могу сказать что-то полезное, но "мистический организм" прокомментирую. Начну с того, что такого организма не может быть никогда :). И главная тому причина - слишком короткая ДНК - всего 15 нуклеотидов. А учитывая, что генетический год триплетный (т.е. каждые тройка последовательно расположенных нуклеотидов кодируют одну аминокислоту в белке), то 15 нуклеотидов могут закодировать максимум пептид длиной в 5 аминокислот (15/3=5), которому до функционального белка очень далеко. Тогда как суть генетического кода именно в том, чтобы закодировать белок с настолько сложной структурой, чтобы он мог впоследствии свернуться в такую пространственную форму, которая обладала бы какой-то  активностью (чаще каталитической). В последнем случае пространственная форма белка изгибается так, чтобы образовать "посадочные места" для нужной молекулы или молекул и, как паук, ждать, когда они там завязнут, чтобы потом либо разорвать их на части, или спарить две молекулы друг с другом, чтобы они образовали одну длинную/большую молекулу. Тогда как 5 аминокислот никакую достаточно прочную форму образовать в пространстве не смогут.
     Пошли дальше. У организмов с короткой ДНК/РНК (но конечно всё-таки большей, чем 15 звеньев) их ДНК/РНК свернута в кольцо. Причем не механически, а путем химической связи между крайними звеньями. Точнее говоря, у таких ДНК/РНК концов не бывает, поскольку сама их форма - кольцо. А это нужно именно затем, чтобы такую последовательность можно было копировать/клонировать. Тогда как концы ДНК-цепочки обычно не копируются. Именно поэтому бактерии бессмертны, а люди стареют из-за того что их ДНК при копировании укорачивается. И как только с какого-то края не откопируется что-то важное, человек умирает. Тогда как короткую ДНК из 15 звеньев в кольцо не свернёшь - двойная спираль не позволит ей так сильно изогнуться. Хотя пептиды (короткие белки могут это сделать).
     Даже если начать сочинять всевозможные ДНК из заданного числа звеньев, то неясен сам критерий того, окажется ли организм с такой ДНК жизнеспособным. Т.к. очевидно, что случайная последовательность звеньев никакого живого организма не создаст, т.к. жизнь - довольно редкое явление во Вселенной.
     Например, если мы займемся мутированием какой-то ... книги :), заменяя в ней буквы на другие случайным образом, то должен быть какой-то эксперт, который бы все эти мутированные тексты читал и выдавал заключение о том, представляет ли литературную ценность хотя бы один из них. А кто будет экспертом по части определения, хороша ли данная мутация у ДНК или плоха? В природе этим занимается "естественный отбор", который отсеивает нежизнеспособные формы, а в этом проекте кто это будет делать? Т.е. проблему я вижу не в сложности замены одних звеньев ДНК на другие, а в том, чтобы определить полезность таких замен для живого организма (в смысле жизнеспособности и скорости размножения).

//Challenge Project: Mysterious Organism
console.log('2 Hi, Organism P. aequor !!!')

// Returns a random DNA base
const returnRandBase = () => {
    const dnaBases = ['A', 'T', 'C', 'G']
    return dnaBases[Math.floor(Math.random() * 4)]
  }
  
  // Returns a random single strand of DNA containing 15 bases
  const mockUpStrand = () => {
    const newStrand = []
    for (let i = 0; i < 15; i++) {
      newStrand.push(returnRandBase())
    }
    return newStrand
  }


2. Просмотрите стартовый код. Есть две вспомогательные функции: returnRandBase() и mockUpStrand(). ДНК состоит из четырех оснований (аденин, тимин, цитозин и гуанин).
При вызове returnRandBase() он случайным образом выбирает базу и возвращает базу («A», «T», «C» или «G»).

3.
Поскольку вам нужно создать несколько объектов, создайте фабричную функцию pAequorFactory() с двумя параметрами:
Первый параметр — это число (не может быть двух организмов с одинаковым номером).
Второй параметр — массив из 15 оснований ДНК.
pAequorFactory() должен возвращать объект, содержащий свойства sampleNum и dna, соответствующие предоставленным параметрам.
На последующих шагах вы также добавите дополнительные методы к этому возвращенному объекту.

//factory function

const pAequorFactory = (n, array) => {
return {
  specimenNum: n,
  dna: array

... ......тело функции................ и встроенные методы будут помещены здесь. кроме функции создающей сразу массив (колбу) с несколькими объектами с разной днк и возможно способными выжить..................

mutate(){},
compareDNA(){},
willLikelySurvive(){},
complementStrand(){}

   }
};

Create_N_pAequor(){};


console.log( pAequorFactory(1, mockUpStrand(returnRandBase()) ))

4.
Ваша команда хочет, чтобы вы смоделировали высокую скорость мутаций P. aequor (изменения в его ДНК).
Чтобы смоделировать мутацию, в возвращаемый объект pAequorFactory() добавьте метод .mutate().
.mutate() отвечает за случайный выбор базы в свойстве dna объекта и изменение текущей базы на другую базу. Затем .mutate() вернет ДНК объекта.
Например, если случайно выбранная база является первой базой и равна «A», базу необходимо изменить на «T», «C» или «G». Но это не может быть снова «А».
Вы можете протестировать этот метод, создав экземпляр pAequor и проверив, что его .dna изменяется после вызова .mutate() на себе.


mutate(){
            //this.dna = arr to change
            const dnaOrigin = this.dna;
            const dnaBases = ['A', 'T', 'C', 'G'];
            const newDna =[];
            let y = [];
            for(let i = 0; i < dnaOrigin.length; i++){
                dnaBases.forEach(el =>{if(el !== dnaOrigin[ i ]){ y.push(el)}});
                newDna[ i ] = y[Math.floor(Math.random() * 3)];
                y.length = 0;
            }
            return newDna;
        },



5.
Ваша исследовательская группа хочет иметь возможность сравнить последовательности ДНК разных P. aequor. Вам придется добавить новый метод (.compareDNA()) к возвращаемому объекту фабричной функции.
.compareDNA() имеет один параметр — другой объект pAequor.
Поведение .compareDNA() заключается в сравнении текущей .dna pAequor с переданной в .dna pAequor и вычислении количества идентичных оснований, находящихся в одних и тех же местах.
 .compareDNA() ничего не возвращает, а печатает сообщение, в котором указывается процент общей ДНК этих двух объектов — используйте .specimenNum, чтобы определить, какие объекты pAequor сравниваются.

Например:
ex1 = ['A', 'C', 'T', 'G']
ex2 = ['C', 'A', 'T', 'T']

ex1 и ex2 имеют только 3-й общий элемент («T») и, следовательно, имеют 25% (1/4) общей ДНК. Полученное сообщение будет выглядеть примерно так: образец № 1 и образец № 2 имеют 25% общей ДНК.

   compareDNA(obj){
            const compare = this.dna.filter((el, i)=> el === obj.dna[ i ] );
            const percent = (compare.length/this.dna.length * 100).toFixed()
            //console.log(percent  + ' == percent == ' + compare.length + ' this ' + compare  + ' = DNA in common');
           console.log( `specimen #${this.specimenNum} and specimen #${obj.specimenNum} have ${percent}% DNA in common`);
        },


6.
У P. aequor больше шансов на выживание, если их ДНК состоит как минимум на 60% из оснований C или G.
В возвращаемый объект pAequorFactory() добавьте еще один метод .willLikelySurvive().
.willLikelySurvive() возвращает true, если массив .dna объекта содержит не менее 60% оснований «C» и/или «G». В противном случае .willLikelySurvive() возвращает false.

willLikelySurvive(){
            const countCorG = this.dna.reduce((total, amount)=>{
                if(amount === 'C'|| amount === 'G'){
                    total++;};
                return total;},0);
                    //console.log((countCorG/this.dna.length*100).toFixed() + '%')
            return (countCorG/this.dna.length*100).toFixed()>= 60?true:false;
        }


7.
После настройки заводской функции ваша команда просит вас создать 30 экземпляров pAequor, которые смогут выжить в своей естественной среде. Сохраните эти экземпляры в массиве, чтобы ваша команда могла изучить их позже.
Для получения объекта из массива в JavaScript можно использовать метод find() . Он принимает функцию обратного вызова, которая будет вызвана для каждого элемента массива. Функция должна вернуть true , если элемент соответствует заданному условию, и false в противном случае.

const Create_N_pAequor = (n) => {
array = [];
let i = 0;
count = 0;
while(i <= n){
    let specimen = pAequorFactory(count ,mockUpStrand());
    if(specimen.willLikelySurvive()){

    count++;
    array.push(specimen);
    i++
   };
};
return array;
};


Отличная работа! Посетите наши форумы (https://discuss.codecademy.com/t/mysterious-organism-challenge-project-javascript/462376?_gl=1*bmop74*_ga*MTc4OTUzNDEzMi4xNjkzNjMyNDE3*_ga_3LRZM6TM9L*MTY5NjM1MjIzOC43NS4xLjE2OTYzNTIyNDAuMC4wLjA.)
, чтобы сравнить свой проект с нашим примером кода решения. Вы также можете узнать, как разместить свое собственное решение на GitHub, чтобы поделиться им с другими учащимися! Ваше решение может отличаться от нашего, и это нормально! Существует несколько способов решения этих проектов, и вы узнаете больше, просматривая код других.


9.
Если вы хотите бросить себе вызов дальше, вы можете рассмотреть следующее:
Создайте метод .complementStrand() для объекта фабричной функции, который возвращает комплементарную цепь ДНК.
Правила таковы, что буквы «А» совпадают с «Т», и наоборот. Кроме того, буквы «C» совпадают с «G», и наоборот. (Подробнее читайте в подсказке)
Используйте .compareDNA(), чтобы найти два наиболее связанных экземпляра pAequor.
Последовательности ДНК встречаются в природе в виде двухцепочечных структур (спиралей). Правила заключаются в том, что основания A связываются с основаниями T (и наоборот), а основания C связываются с основаниями G (и наоборот).
Предположим, у нас есть две нити ДНК, назовем их нить1 и нить2. Если первое основание цепи 1 — это «А», то противоположное основание цепи 2 — это «Т». Если вторая точка нити 1 — «C», то противоположное основание нити 2 — это «G».
Чтобы отобразить это как часть вашего кода, если последовательность .dna:


[ 'T', 'A', 'C', 'A', 'G', 'A', 'T', 'A', 'C', 'G', 'A', 'C', 'G', 'A', 'T' ]
Then .complementStrand() should return:
[ 'A', 'T', 'G', 'T', 'C', 'T', 'A', 'T', 'G', 'C', 'T', 'G', 'C', 'T', 'A' ]


complementStrand(){
            let complementDna = [];
            const  createComplement = this.dna.forEach((el)=>{
                switch (el){
                case 'A':
                complementDna.push('T');
                break;
                case 'T':
                complementDna.push('A');
                break;
                case 'C':
                complementDna.push('G');
                break;
                case 'G':
                complementDna.push('C');
                break;
                default:
                complementDna.push(el);
                break;};
                });
            return complementDna;
        }

FULL CODE - ОКОНЧАТЕЛЬНЫЙ КОД можно посмотреть тут, на моем  GitHub (https://gist.github.com/mtapirina/29dc1e59ab8e1b23cc1d3ffe5014cb44)

Вот с этой скотиной я намучалась.. она мне плешь проела!
Функция, чтобы создать энное количество этих инфузорий сразу, более или менее жизнеспособных(60%), и затолкать их в одну колбочку ( массив)...


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


Кажется решение подобных задачек это самое интересное, чем я занималась... жаль, пока это все..

Но Пиздец не дремлет... Он подкрался незаметно... Это страшный и ужассссный DOM!!!



Цель этого модуля — показать, как JavaScript используется для добавления интерактивных возможностей на веб-сайт.

После этого модуля вы сможете:

Сможете добавить JavaScript на сайт для интерактивности
Опишите, что такое DOM
Объяснить, что такое события DOM.
Сможете создать формы с использованием HTML и проверять их с помощью JavaScript.

Все эти знания вы примените на практике в рамках предстоящего проекта. Вы можете завершить Портфолио-проект как параллельно, так и после получения необходимого контента — решать вам!

    С таким критерием (>= 60% GC) мутации неизбежно приведут к тому, что ДНК только из одних этих GC и будет состоять. Кстати, интересно ли вам, откуда этот критерий взялся?


    Тем не менее, основная польза от JS состоит в том, что с его помощью можно управлять DOMом! А через этот DOM делать HTML-страницы динамичными и интерактивными гораздо в большей мере, что это позволяет сам HTML. Тогда как программирование самом JS в общем-то почти не нужно - практически ничего из тех упражнений по JS для работы с HTML-страницами не пригодится.

это не важно. Когда что то нравится оно все равно потом найдет куда примениться..
Да я видела эти скучные длинные домовские строки.. нудня полная..

А разве не нужен код  для разработки каких то веб приложений.. или для тех же браузерных игр ?

по сути мне и в С шарпе нравилось то, что с помощью кода лисенком или иным объектом можно управлять. И там как раз были нужны эти циклы и вызовы из одних классов другие..

где еще используется .. ООП?


может быть... хотя при том рандоме, никогда не видела более 90%

расскажи, откуда этот критерий взялся?

Там сама понимаешь, проект вымышленный, как и сами эти инфузории туфельки.. у инфозорий наверно и то длиннее ДНК

Pipa,

Смотри Пипа, что я заметила, страница не отражает [ i ], если квадратные скобки сдвинуты близко к i
Раздвинула скобки по всему тексту.

Почему не видно??

     В заплетенной косичке :) из двух комплиментарных нитей ДНК поперечная связь между G и C прочнее, чем связь между A и T, по той причине, что пара G и C связана между собой тремя водородными связями, а пара A и T - только двумя:

(http://forum.postnagualism.com/images/%D0%94%D0%9D%D0%9A.png)

Поэтому если пар G и C будет мало, что косичка рискует расплестись, особенно когда ДНК короткая.

Pipa,

Спасибо!

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

Это какая то неорганическая химия.. А вроде бы живые организмы..
Все живое из неорганики сделано да?
Что же их оживляет?

https://discoveringthegenome.org/discovering-genome/dna-sequencing/dna-complementary-base-pairing

     Как раз это - органическая химия. Впрочем, термин "органическая химия" хоть и традиционный, но буквальный смысл его давно потерян. В старину органической химией назвали исследование веществ, выделенных из живых организмов, отсюда и ее название "органическая". Однако с тех пор много воды утекло, а тем более выяснилось, что классификация по источнику выделения вещества никуда не годится, поскольку одни и те же вещества были найдены, как в живой природе, так и в неживой. А потому границу провели иначе - к органической химии стали относить вещества, состоящие из углеродного скелета (цепочки из связанных валентной связью атомов углерода), хотя на этом скелете могут быть навешены гетероатомы (в основном кислород и азот, реже сера и фосфор).
     Углерод несомненно заслуживает того, чтобы в его часть назвали целую химию :), поскольку обладает уникальным свойством - образовывать из своих атомов очень длинные цепочки (теоретически до бесконечности), которые в силу своей электрической нейтральности чрезвычайно устойчивы к химическим воздействиям со стороны. В кольца сворачиваться такие цепочки тоже могут, причем не только в большое кольцо, когда концы цепи соединены между собой, но и иметь по длине цепи множество мелких узелков (про 5-6 звеньев). Именно по этой причине, углеродные цепи являются на молекулярном уровне идеальным строительным материалом для крупных/объемных конструкций. Отсюда и громадное многообразие органических соединений, т.к. число сочетаний и перестановок очень быстро растет (вспомним факториал) про мере увеличения числа атомов в молекуле.
     А поскольку жизнь - сложная штука, то если уж конструировать ее на химичкой/молекулярной базе как химическую машину (!), то только на базе углерода, т.к. только на его основе можно построить очень большие молекулы, обладающие необходимыми для построения живого организма свойствами. Этому выбору способствовало еще и то, что углерод - весьма распространенный химический элемент во Вселенной, т.к. представляет конечный продует выгорания звезд. Ну, а на Земле когда-то вообще была углекислотная атмосфера - загребай углерода сколько захочешь на халяву. Да и не было тогда иной возможности. И вот тогда и началась реакция фотосинтеза (хотя неизвестно, что для нее послужило тогда катализатором), когда из углекислого газа и воды за счет энергии солнечного света стали образовываться углеводы (в просторечии - сахара), а дальше пошло-поехало...
     Лично я считаю, что жизнь на электронной основе (т.е. на базе электроники) была бы намного перспективнее (а ля вокалоиды :)), однако в те времена электронная база не могла возникнуть в принципе. Тогда как химическая основа создавала возможность для возникновения жизни, пусть и не такой перспективной, как электронная :). Ибо даже одна капля вещества содержит в себе астрономическое количество молекул (порядка 10²² штук!), а сколько их в мировом океане и говорить не приходится. А поскольку химические вещества имеют склонность к взаимодействию другом с другом (реакционная способность) и им на эти игры были предоставлены миллиарды лет, то из случайных молекулярных столкновений и реакций между ними вполне могло получиться что-то экстраординарное. Конечно же, не сразу живое существо появилось :), а поначалу какая-то молекула, обладающая способностью катализировать образование своих дублей/клонов, ну а дальше уже пошла эволюция среди этих клонов.
     Что же касается ДНК, то возникла она гораздо позже, а функция ее гораздо скромнее - она служит "записной книжкой" для огромного числа белковых структур, синтезируемых в живом организме. Т.е. "эволюция клонов" в конце-концов "пришла к решению", что синтезировать клоны следует из блоков (подобно блочному жилищному строительству), а в качества блоков были "выбраны" аминокислоты.  Сейчас их 20-25 штук (более редкие аминокислоты то включают в перечень, то исключают из него по причине редкой встречаемости). А в ДНК записан порядок/последовательность, в котором их следует стыковать/соединять друг с другом, чтобы получился законченный функционал. Т.е. ДНК-кодирование и блочное строительство - это один и тот же проект, т.к. кодировать можно только то, что состоит из ограниченного числа элементов/блоков. И может быть аминокислоты в качестве таких блоков не шибко хороши, но только так можно было передавать удачные конструкции/комбинации по наследству.
     Т.е. сама по себе ДНК неживая, а имеет такую структуру исключительно ради того, чтобы эту ДНК можно было дублировать/клонировать наиболее просто. Для этого косичка ДНК расплетается на две нити. Этим нитям не дают обратно заплестись друг с другом, а нагнетают в их окружение смесь индивидуальных нуклеотидов ATGC. А поскольку у расплетенной цепи теперь пары нет, то эти нуклеотиды налипают на нее по принципу A+T и G+C, по началу держась за нее водородными связями (где тремя, а где двумя). А потом по той цепи "проедет" фермент ДНК-лигаза, которая свяжет налипшие на нее нуклеотиды в одну цепь и заплетет косичку (как замок на молнии). Так получается комплиментарная парная цепь и форма косички. А пары A+T и G+C образованы по простому принципу - один нуклеотид в паре толстенький (из двух колец), а другой худенький (из одного кольца). Поэтому если в пару станут два худеньких, то они не дотянутся друг до друга водородными связями, а если два толстеньких, то в этом месте возникнет утолщение, и "молния" не застегнётся, пока слишком жирный партнер не покинет свое место.

Вот и DOM наступил.. пока что это кажется какой то извращенной джаваскрипт.. например вызывая функцию при событии щелчка мыши event on click, не ставятся скобки.

И тягомотный css в стиле кемалкейс эт воообще жесть.. ну кто в теме тот понял.. почему то пробела в названиях css элементов DOM не берет.. писец..
font-family  будет писаться как fontFamily ... ну и тому подобная хрень..

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

И кстати массивы там тоже есть. У элемента родителя целый массив выводков. чилдренов..
А Пипа говорила не нужны будут итерации по массивам..
Боюсь она ошиблась... и перебирать выводки чилдренов будет так же весело, как и то что мы с инфузориями практиковали...

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

Все эти map(),  filter(), pop(), reduce(), push()....  и прочее.. и примеры... что бы все все помнить практиковать нужно много..

из урока пра DOM  (перевод гуглы)... сравнение с собакой Павлова умиляет! :)

"После того как определенное событие срабатывает в определенном элементе объектной модели документа (или DOM), можно создать функцию обработчика событий для запуска в качестве ответа. ...
Давайте сравним возникновение событий с чем-то более знакомым: собакой, приученной есть, когда она слышит звук колокольчика! (Это известно как павловское обусловливание.)
Как вы можете видеть на диаграмме, звон колокольчика аналогичен срабатыванию события JavaScript.
Собаку обучают предвидеть звонок в колокольчик, и это действие аналогично созданию прослушивателя событий.
После того, как собака услышит звонок, она подойдет и съест свою еду!
Этот ответ похож на функцию обработчика событий, которая выполняет код, который на веб-сайте может изменить цвет элемента, текст и многое другое!»"

На этом вообще вся наша жизно построена..
 ну и вообще - таким же образом - дрессируют и конечного пользователя..
мигают сообщения новые на иконке приложения - открыть, просмотреть, ответить...
нажми кнопку и получишь пирожок..
а еще выбешивают боты - ну когда только на сайт войдешь, еще осмотреться не успел - вылазиет окошко - хотите поговорим? задайте вопрос или позвоните мне!
Типа там кто то реальный сидит, а не тупая программа..
Понимаю, если бы я сама искала контакт.. Но такую манипуляцию наглую - не переношу.. отвлекает, мешает просматривать контент, и вообще - многие просто закрывают страницу. То есть для хозяев сайта - не рентабельно терять клиентов..
но они тупы, как выхухали..лишь бы показать, что у них тоже есть atencion al cliente (Обслу́живание клие́нтов).. а надо оно не надо и главное КОГДА  оно надо - этих идиотов не волнует..

    Так я "правильного" джаваскрипта практически нигде в чистом виде не встречала, а воспринимаю JS, как приладу к DOMу. Т.е. JS я не по учебникам, а на практических примерах изучала, где все они сплошь с DOMом повязанные. Более того, по этой же причине, я и воспринимаю DOM и JS, как одно целое. Типа того, что DOM перечисляет/именует объекты, а JS что-то с ними делает.
    Ну и вообще я привыкла к С и С++, где в первом вообще нет объектов, из которых можно было бы запускать их собственные методы через стрелочки или точки, а у второго такая возможность есть, но объекты надо конструировать самой :). Правда там есть библиотека готовых объектов (stl), но я ей обычно не пользуюсь. Опять же по той причине, что написанное самой легко потом отлаживается прогонкой по шагам, тогда как чужой объект - потёмки :).
    По той же причине мне из языков web-программирования нравится PHP. В нем таких объектов почти нигде нет, а всё пишется, как на старом добром Си. Т.е. по возрасту это довольно старый язык, но его из года в год "подкручивали" под современность, добавляя новые функции и возможности. Кстати и этот форум тоже на этом языке написан.

На самом деле DOM не приаязан к javasript. И он может работать с другими языками. Но наверно ты права... раз  JS это язык сценариев, то только через DOM  и дорога к содержимому HTML..



Мне интересен с++. Но он привязан к плаформе, говорят. И говорят что сборшики мусора на других платформах ( не microsoft) бывает работают некорректно, а то и ошибки выдают, на линуксе кто то жаловался что библиотека g++ не корректно работант..

А я на маках обычно сижу.
Потому и не берусь.. ранее бросила по молодости.. а позже из за платформы..
Думаю пока с JS разбрусь, прежде чем на более серьезные языки переходить..

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

 Java тоже любопытна была именно из за кроссплатформенности.. но там и недостатки есть.  Пользовалось программой от парня одного, нашего местного, практически соседа. Но там постоянно нужно было обновлений ждать. Программа работала, но порой глючила на маке из за устаревшей библиотеки.. или что то в таком роде.
Порой приходилось лично ему писать, чтоб он под конкретно мою операционку ( на тот момент мак ос х немного устарелый)  исправления делал..
 То есть какие то папки приходилось докачивать..
Не знаю, я не совсем поняла в чем так проблема. Наверно именно в библиотеках, которыми он пользовался..
Одним словом и java  хоть и привлекательна  тоже под сомнением..

swift ограничен платформой... тоже не интересно..

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

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

DOM довольно скучно учить. Для разнообразия взяла курс на JS  и Phaser.js, игры 2д браузерные..

Так как это курсы от той же академии, то половина курса у меня уже пройдена, так как там учитывается два курса до среднего intermediate по JS, которые я уже прошла. И проекты там те же самые - угадай число, камень ножницы бумага,  волшебный шар предсказателя...
Но потом они добавили уроки по библиотеке phaser ( так понимаю, это библиотека ). Которая конкретно под простенькие 2д игрушки заточена, и даже какие то шаблоны есть, предустановленные, типа адвентуры или платформера..
Довольно любопытко и думаю я не сильно отклонюсь от основного пути., да и немного развлечет, а то дом этот реально заунывный..
На css подобные эффекты делаются гораздо проще,  ну всякие там смены цветов или изменение размера картинки... и мы это проходили уже.. пока нам ничего любопытного в DOM не показали.. но наверно что б веб формы цеплять он необходим..

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

А из серьезных языков я просто не знаю, что выбрать..
Нам усиленно пихают Python и SQL , не сейчас, но для back end, если я до него доживу... так же его. Питона рекламмируют для работы с AI и для обучения интеллектуальных программ..
Но все же эт совсем другое..  

Не то же самое, что C++ или даже Java или Swift..


javascript - node.js ( далее идут - React, Redux по программе ну и Phaser,js) , а там посмотрим..,

а смысл вообще что то учить. Куда это потом? Не пригодится в жизни. Если как досуг, то куда интереснее возиться с оллидебуггером)) или софтайсом разгадывая крякме.
 Или например зачем изобретать велик, пытаясь создать всё заново с нуля, когда всё уже придумано. Вот к примеру возьмём данный форум. Тут поисковик корявый и дурной, на СТ так вообще ничё не ищет. Раньше на ХР была прога, называлась google decktop searsh, весила 600 килобайт. Офигенная прога. Весь хард перелопачивала, искала даже внутри текстовых документов и архивов. Можно же её распотрошить и выдрать оттуда поисковые алгоритмы, да прикрутить их к форуму. Так всё проще, чем свои сочинять. Это так, в качестве примера.

..
Мне игры интересно, потому что сама любила играть.
Аркадные платформеры и тому подобное.
..

Ну наверно люди все разные.. и развлекают их разные вещи.

     Я имела в виду не привязку DOMа к Javascript'у, а наоборот - привязку Javascript'а к DOMу, чтобы иметь инструмент манипулировать этим DOMом на стороне клиента без участия сервера. Вот и выбрали для этой цели Javascript, кое-где чуть ли не насильно превратив его в скрипт. Но не всегда так было - в пору доминирования Microsoft Internet Explorer'а в качестве скрипта в HTML-страницы вставляли "апплеты" от той же компании Микрософт (у нее был свой DOM, хотя он так тогда не назывался). А уж потом, когда началась война стандартов и Internet Explorer в этой войне проиграл международному стандарту, то в тот же момент и Javascript оказался на коне.


     Напротив, C, как и его "последователь" C++, широко представлены на самых разных платформах. Это C# жестко привязан к Windows, поскольку генерит не автономное приложение, а такое, которое работает только при поддержке FramеWork. Этот FramеWork Микрософт когда-то написала для Windows, а ныне он, выдержав множество редакций/версий, почти достиг размера операционной системы :). По сути это гигантский Phaser :) с функциями на все случаи жизни. Потому-то с программы, написанные на C#, могут работать только на тех компьютерах, где соответствующий FramеWork уже проинсталлирован. А после того, как версий FramеWork стало много, совместимость программы с чужим FramеWork'ом иногда превращается в проблему, несмотря на то, что Микрософт всеми силами старается, чтобы новые версии FramеWork были совместимыми с вызовами старых версий FramеWork'а (совместимость сверху вниз).


    А языки C и C++ не могут не поддерживаться, т.к. сами эти операционные системы на них написаны:
   Конечно, не сама операционная система язык поддерживает, но если она сама на этом языке была написана, то компилятор для этого языка где-то существует и должен быть доступен.


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


   Хотя в деле постижения Javascript'а ты уже меня сильно превзошла :), хочу указать на недостаток (таким он лично мне видится) твоего образования. Мне он видится в перекосе на клиентскую сторону.
    Суть интернета в интерактивной (!) связи клиент-сервер, откуда и весь его профит. Тогда как коучи усиленно пичкают тебя языками, работающими исключительно на стороне клиента. Т.е. твоим самописным играм сервер, по сути, не нужен, т.к. все они работают на стороне клиента, во время работы не обращаясь к серверу. Ну а то, что эти игры с сервера загрузили, дела не меняет, - точно так же их могли прислать на флешке, дискете или сидюке. Из-за такого перекошенного в одну сторону обучения и ситуация выглядит перекошенной - клиент кажется самодостаточным, а сервер ненужным.
    А для того, чтобы исправить этот перекос, надо не только скрипты для браузера писать, но и активно заниматься созиданием на серверной стороне.
    Что касается базы данных, то, на мой взгляд, SQL в полном объеме едва ли стоит изучать - вполне достаточно его урезанной web-версии: mySQL. В действительности для дела хватает не более 10 функций, и в mySQL все они есть. Т.е. именно этот десяток функций и следует "выучить", хотя надежнее пользоваться "словарем". Ничего там сложного нет - суть дела становится понятной через 30 мин изучения предмета.
    Тем не менее, сайты, форумы и чаты обычно на Javascript не пишут, а чаще на PHP. Именно его и стоит в первую очередь изучить. И это отнюдь не сложно, т.к. на язык C он сильно похож, а сложностей типа C++ и Javascript в нем нет. Очень простой язык!

Спасибо за разъяснение! Да я помню то время когда джаваскрипт была в аплетах.. и как как часто крашился компьютер и лезла всякая вирусня из интернета.
Сейчас такого не происходит. Где то с вин 7 точно. Но и на вин хр уже крашей стало меньше намного, чем на всех тех windows что были до него.


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

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

А на основном курсе он разбит на ступеньки - только сейчас после базы под джаваскрипт - нас стали учить формам html..

А потом покажут как эти формы подтверждать. И самопальные проверки добавлять в отправку и тд.

Сейчас я прошла только 40%... это с прошлого года то..

Впереди вижу React и Redux

Асинхронная javascript и запросы http...

Веб приложения...

Какое то приложение для reddit это соц сеть.

То есть насколько понимаю работа с сервером предполагается вся на джаваскрипте.

( sql и phiton это я на курсе бэкэнда видела. Но пока этот курс не закончу я туда не полезу...)

Тут на сайте академки есть много курсов по языкам программирования. По сути вся академка только программированию и учит.
Мне нравится как объясняют и то что много практики ( хотя практики всегда не хватает новичку).
Ну вот я и заглядывалась на разные языки.



Так это уже бекэнд, разве нет?

Я думала его взять тоже.. но потом. После фронтэнда.

Если доживу.. очень уж курсы ёмкие.

     Так я не работу клиента с сервером имела в виду, а работу сервера с клиентом! Пусть клиент обращается к серверу хоть на тарабарском языке, но со стороны сервера должен же быть софт, который этот язык понимает? А твой перекос именно в ту сторону, что ты понимаешь, что со стороны клиента надо писать программу или скрипт, а сервер представляешь, как ящик, который включаешь в розетку и вот он уже всё умеет делать. Тогда как надо понимать, что со стороны сервера тоже должна быть программа, которая посылки от клиента понимает, и что такие программы тоже надо учится писать.
     Например, я языка Javascript для сервера никогда не видела и даже не слышала о его существовании. В самом деле, если со стороны сервера нет браузера, то и откуда там Javascript'у быть?
     Apache еще нужно научиться конфигурировать - это сердце севера, которое занимается приемом посылок от клиентуры. Рядом с ним обычно и mуSQL стоит, т.к. базы данных обычно хранятся на стороне сервера, а не клиента. Ну и команды серверной операционной системы тоже нужно знать - там обычно FreeBSD стоит, реже Linux. А Windows или MacOS не бывает никогда :).

Это back end.
Там работу сервера с клиентом изучают и пишут программы именно для серверной части. И там в курсе идет  - Phyton и mySQL. Как основные языки.
И конечно это очень важная часть.

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

Там и не дадут ничего делать на стороне сервера, даже чтоб потренироваться.
Либо придется им доплачивать отдельно. Так как все эти площадки под сайты стараются свои услуги продать.)

Они даже SEO мета теги для поисковиков не дают вкручивать в страницы, сами продают, как услугу

Соня тварь.я об этом давно предполагал,

      А в этих папках что? HTML-страницы? Если так, то сервер используется просто как внешний диск для хранения и скачивания файлов. Типа используется как удаленная флешка :).

Пипа , соня тварь , не ищи себя в ней.

Смотрю курс по back-end

PostgreSQL - это чем от mySQL отличается?
Тут на нем учат сервер разворачивать.

Как создать API с Node Express PostgreSQL  и развернуть на каком rendere наверно симулятор для подобного рода приложений

На джаваскрипте делается тестирование.
Тут ознакомят с TDD test driven development и применять его принципы для развертки back end ( очеаидно серверного приложения).

И много еще странных вещей, типа TLS  transport layer security  , RBAC role based access control  


Алгоритмы,
Структуры данных


И много еще всякого не понятного..

Блин чего ты страдаешь?

Серверная версия JavaScript это Node.js.
 Джавскрипт без Ноды всё равно, что наушники без плеера.
 Хотя, Node.js это довольно странный бекенд для джаверов или шарпистов. Там весь прикол в npm пакетах, через которые подключаются те или иные серверные технологии. Пакеты ставятся и обновляются через Сеть, а по сути каждый пакет является проектом Node.js, реализующим какую-то функцию.
 Если есть желание познакомиться с Node.js просто и понятно, рекомендую на платформе Udemy.com курс Богдана Стащука.

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

     Судя по расширению файла "js" (Node.js), он сам является скриптом на языке Javascript. Тогда как файлы с таким расширением для операционной системы по умолчанию чужды - она просто не знает, что с ними делать и как их обрабатывать. Поэтому это ваше замечание сродни представлению, что сервер нужно только в розетку воткнуть, чтобы он сразу научился всё на свете делать. Еще раз повторяю: Javascript не является для операционной системы языком по умолчанию, а потому, прежде чем на ней js-скрипты гонять, должно проинсталлировать на нее интерпретатор или компилятор этого языка и настроить так, чтобы файлы с расширением "js" доставались на обработку ему.
     Посмотрела в интернете, что там пишут по этому поводу. Так и есть - Javascript не интерпретирует сам себя, а для этой цели используется "V8 (движок JavaScript)":

npm - Это просто установщик пакетов насколько я знаю. Инсталлятор "плагинов" и/или библиотек js
Чего там странного, сам npm ничего не делает кроме поиска версий и установок.
Но вот уже установленные дополнения (пакеты)  используя командную строку  добавляют к командам npm и свои команды и делают интересные штуки.

я же расказывала про Vite пакет, который устанавливается для фронтэнда.. разворачивает всю структуру разработчику в один клик. А потом создает сборку, оптимизируя все папки и файлы.
|dist с игрой в Звезды - именно такой папкой и был, после оптимизации. Типа дистрибютивная версия.
При этом сами файлы разработки не изменяются. Просто добавляется вот эта новая папка.

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

"Долгое время браузер был единственным местом, где можно было выполнить код JavaScript. Веб-разработчикам приходилось использовать разные языки программирования для внешнего интерфейса и для серверной части. Это также означало, что, хотя JavaScript превратился в более надежный и мощный язык, он оставался языком только внешнего интерфейса.

Несмотря на многочисленные попытки создания внебраузерной среды JavaScript, Node.js, изобретенный Райаном Далем в 2009 году, обрел беспрецедентную популярность и в настоящее время используется многими ведущими компаниями, включая Netflix, Uber, Paypal и eBay. Node.js — это среда выполнения JavaScript или среда, которая позволяет нам выполнять код JavaScript вне браузера. «Среда выполнения» преобразует код, написанный на языке программирования высокого уровня, удобочитаемом человеком, и компилирует его в код, который может выполнить компьютер.

Хотя Node был создан с целью создания веб-серверов и веб-приложений на JavaScript, его также можно использовать для создания приложений командной строки или настольных приложений."

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

https://www.youtube.com/v/cdX8r3ZSzN4

 :)

Круто!!

Юмор с виндой:

1. УСТАНОВКА НА РАБОЧИЙ СТОЛ НЕПРИЛИЧНОГО ФОНОВОГО РИСУНКА С ЗАПРЕТОМ ЕГО ИЗМЕНЕНИЯ.
Представьте себе, приходит сотрудник на работу, включает компьютер и видит на Рабочем столе... скажем так, картинку фривольного содержания, ну или надпись «Наш директор — козе.!». Пока не пришед этот самый директор, сотрудник пытается сменить картинку на Рабочем етоле, пытается, пытается, но... безрезультатно. Приходит директор, сотрудника уносят.
Чтобы учинить подобное безобразие следует установите требуемый рисунок на Рабочий стал (стандартным способом), а потом запретить его изменение. Последнее реализуется путем установки параметра NoDispBackgroundPage (типа DWORD) со значением 1 в разделе HKEY_CURRENT_ USER\Software\Microsoft\ Windows\CurrentVersion\Policies\System.
в Висте не получилось, отсутствует ключ System.создание этого ключа не помогает,всеравно не работает,это прикол только под ХР похоже.

2. ВСПЛЫВАЮЩЕЕ ОКНО С ТЕКСТОМ ПРИ ЗАГРУЗКЕ СИСТЕМЫ.
Пользователь включил компьютер. Заканчивается загрузка системы. Как говорится: «Ничего не предвещает бурю и тут внезапный порыв ветра* в конце загрузки появляется всплывающее окно, в котором говорится, что пользователь - *** или **** и еще много чего. Причем это сообщение будет появляться каждый paз при загрузке системы.
Устроить такой психологический прессинг можно, зайдя в раздел реестра HKEY_LOCAL_MACHINE\SOFTWARE\Мiсrosoft\WindowsNT\CurrentVersion\Winlogon (если подраздел winlcgon отсутствует то его нужно создать) и создав и нем строковый параметр LegalNoticeCaption и строковый параметр LegalNoticeText.
В качестве значения LegalNoticeCaption укажите строку,
которая будет выводиться в заголовке окна вашего сообщения
этот прикол я пробовал у себя на Висте, все работает единственное окошко не плавающее, а встает как запрос выбора пользователя, и под низом кнопочка ОК, для входа в систему

3. ПОСЛЕ ЗАГРУЗКИ WINDOWS XP КОМПЬЮТЕР АВТОМАТИЧЕСКИ ВЫКЛЮЧАЕТСЯ.
После загрузки операционной системы компьютер автоматически выключается. Пользователь, не понимая что произошло, снова пытается ВКЛЮЧИТЬ компьютер. Загружается операционная система, компьютер выключается. И гак МНОГО-МНОГО раз, пока пользователя не охватит истерика, он не начнет кусаться, драться и вспоминать маму того, кто этот компьютер настраивал.
Делается такая подлость просто: достаточно в разделе HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Run создать параметр типа REG_SZ с произвольным названием (например, Kaput ) и в качестве его значения указать С: \WIMDOWS\system32\shutdown.exe (вместо С: \WIWDOWS у вас может быть свои путь, по которому установлена система). Перезагрузите компьютер и начните развлекаться.

4. ОДНОВРЕМЕННО С ПРОГРАММАМИ АВТОЗАГРУЗКИ ОТКРЫВАЕТСЯ ЛЮБОЙ ФАЙЛ В СООТВЕТСТВУЮЩЕМ ПРИЛОЖЕНИИ, НАПРИМЕР, ВИДЕОФАЙЛ.
Немного усилий и можно сделать гак, что в конце загрузки системы автоматически будет открываться файл в соответствующем приложении. К примеру, так можно установить воспроизведение музыкального файла или видеофайла (что относительно безобидно), до запуска чего-нибудь посерьезнее.
Делается это путем создания в разделе HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Run параметра типа REG_SZ с произвольным названием (например, FileZasada) и в качестве его значения указания пути к файлу, который необходимо открыть.

5. УСТРАИВАЕМ «СИНИЙ ЭКРАН СМЕРТИ».
Устроить любование культовым Синим экраном смерти (Blue Screen of Death — BSOD) можно достаточно просто. Следует и в раздел HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Services\i8042prt\Parameters и создать параметр CrashOnCtrlScroll типа DWORD со значением 1.
После перезагрузки компьютера, удерживая правую (!) клавишу «Ctrl», нажмите дна раза па клавишу «Scroll Lock». В результате вы либо увидите «синий экран смерти», либо принудительно обрушите систему И она будет перезагружена.

6. ЗАМЕНА ЗАГОЛОВКА ОКОН INTERNET EXPLORER'A.
Последнюю составляющую заголовочной надписи окна Internet Explore'a вы можете заменить, указав текст, который должен выводиться вместо надписи «Maicrosoft Internet Explorer». Для этого нужно перейти в раздел реестра HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Internet Explorer\MAIN u создать в нем строковый параметр Window Title И качестве значения этого параметра и укажите требуемым текст.
Изменении вступают в силу без перезагрузки компьютера.

7. ДЕЛАЕМ НЕВИДИМЫМИ ДИСКИ.
Вы можете сделать так, что логические диски винчестера на компьютере не будут видны (все или выборочно) ни в окне Moй компьютер, ни в окне Проводника, ни в окнах Открыть и Сохранить, используемых в программах - да почти нигде. Однако С дисками можно будет работать, обращаясь к файлам напрямую, либо используя программы — файловые менеджеры (например, Windows Commander).
Чтобы учинить такое, нужно перейти в раздел реестра HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Policies\Explorerr и создать в нем параметр NoDrives типа DWORD. В качестве значения данного параметра указывается битовый код, соответствующий тому, какой диск иди диски вы собираетесь таким образом скрыть. При этом каждый бит кода соответствует одному из 26 возможных имен дисков. Каждому диску присваиваются значения (hex): диску А соответствует значение 1; диску В — значение 2: диску С — значение 4 и т. д. Чтобыскрыть несколько дисков, нужно сложить соответствующие им биты. Потом битовый кол переводится в шестиадцатерич-иос значение. Таблица значении параметра NoDrives и их описание для некоторых дисков приведена в табл.

Значения параметра NoDrives
0xO3FFFFFF Скрывает все значки
0x3 Скрывает только диски А и В
0x4 Скрывает только диск С
0x8 Скрывает только диск D
0x7 Скрывает только диски А, В и С
OxF Скрывает только диски А, 8. С и D
0x0 Видны все диски

работает после перезагрузки системы.

8. СКРЫВАЕМ ВСЕ ЭЛЕМЕНТЫ РАБОЧЕГО СТОЛА КРОМЕ КНОПКИ ПУСК.
Представьте себе картину: вы включаете компьютер, загружаете Windows ХР... а на Рабочем столе ничего пет. Одна кнопка Пуск красуется. И делайте что хотите, ничего на Рабочем столе и не появится. Чтобы сделать такое, нужно зайти в раздел реестра HKEY_CURRENT_USER\Software\Microsoft\Windows\CurrentVersion\Policies\Explorer и создать в нем параметр NoDesktop типа DWORD сo значением 1. Результат можно наблюдать после перезагрузки компьютера.

9. БЛОКИРОВКА КНОПОК "ВПЕРЕД'» И «НАЗАД» В INTERNET EXPLORER'E.
Устроить невинную шалость - отключить кнопки Вперед и Назад в окне Internet Explorer'a и тем самым значительно усложнить жизнь тем, кто этим Эксплорером пользуется достаточно легко. Для этого нужно зайти и раздел реестра HKEY_CURRENT_USER\Software\Policies\Microsoft\lnteinietExplorer\Restrictions и установить там параметр NoNavButtons типа DWORD со значением 1.
к сожалению в Висте данная ветка реестра отличается, думаю что тем у кого стоит 7 эксплорер этот вариант тоже не пойдет.

10. ПЕРЕЗАГРУЗКА ВМЕСТО ЗАВЕРШЕНИЯ РАБОТЫ МЕНЯЕМ ЗНАЧЕНИЕ SHUTDOWN НА RESTART.
Представьте себе, пользователь выключает компьютер (Пуск— Завершение работы - Выключить), а компьютер выключается и снова включается (перезагружается). Пользователь снова выключает компьютер, а он снова включается. И так- много раз. Пользователь начинает рвать на себе (а может, и на других) волосы, ему вызывают скорую помощь, увозят. Компьютер по-прежнему сам включается при выключении (программном). В принципе можно просто вырубить компьютер отключив его электропитание, но это уже другая история.
Делается подобный трюк путем замены функции Shutdown на Restart. Для этого следует зайти в раздел реестра
HKEY_LOCAL_MACHINE\SYSTEM\CurrentControlSet\Control\Shutdown и для параметра FactReboot (типа DWORD) установить значение 1.
к сожалению в Висте данная ветка реестра отличается.

В США разработчикам в экспериментальных целях платят, чтобы они программировали в режиме изменённого сознания. В Университете
Мичигана проводят исследование «Накуренный во время программирования».

(https://habrastorage.org/r/w1560/getpro/habr/upload_files/cc0/00e/b39/cc000eb3989efe84730c41678777794e.jpg)

https://habr.com/ru/news/820399/

Вот потому я Виндой не пользуюсь.. Очень очень редко.. После подобных шуток доверие теряется к операционной системе :)

В надежде что накурят настоящий ИИ..

Вернулась в Код-Академию, продолжаю учиться.

Сдала очередные экзамены.
3-и из 5.

первый курс был - Основы Веб (html)

второй курс - Стилизация (css)

третий курс - Построение Интерактивных Веб Сайтов ( добавилась js и git).

Теперь четвертая часть,  front-end разработка. Ну и весь упор с самого начала на js.
Это уже третий уровень.

(прошла фазер, для души, он в эту цепочку не входит, игры - это ответвление).


РS
Захожу на форум почитать, когда выдается свободная минутка.
Всех обнимаю, рада что ВЫ есть!!!

Оставила (пока) не выполненным проект с личным веб- портфолио.
Лень, да и спешить особо не куда. Впереди два больших раздела и 2 экзамена, каждый из 2х частей (теория и практика).

И клиентов искать не собираюсь, так что не вижу особого смысла в "порфеле" лично для себя.

Но если набацаю что нибудь, то покажу.


Там как бы по заданию надо показать скилы, которым обучились. Использовать базовые основы джаваскрипт, для интерактивности.

На самом деле мне реально никакое не нужно.

Ну разве что - как практика и похвастушка..

Сам проект - этапы работы над ним (задания) - выглядит так.

Заканчиваешь - сбрасываешь задание в сторону, в колонку - "выполнено".

А из новшеств - добавили подсказки и помощь искусственного интеллекта (ИИ).

Обучающий Асистент (Помощник) ИИ

В области редактора кода ( - уроков  с программированием).

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

ИИ пишет свой анализ по поводу этого куска. Ну и подсказки дает конечно.

Самое смешное, что анализ ИИ можно лайкать или дизлайкать..
Типа понравилось объяснение или оно было не информативно.

 :)

Вот вроде бы люди учат машины, так нам это преподносят обычно.
Но тут как мне кажется - обоюдно происходит. Программы учат нас, и вместе с нами сами учатся.

Работаю над проектом для моего тех портфолио.


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

Я решила немного расширить проект, и добавить что то вроде оракула, со стандартными фразами, взятыми в сети, и моими рисунками.

Открывая страницу - оракул автоматически выкинет карту и описание, выбрав случайно из массива объектов -  карту и описаний.

Самое сложное -это поиск цитат. Особенно для Оракула. Пока что нашла весь материал на англ. Буду работать с ним.

А вообще - в портфолио надо напихать свои проекты и ссылки на них, чем больше, тем лучше.
Так понимаю, это что то типа "похвастушки" перед работадателями или другими разработчиками.)

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


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

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12834;image)

Генератор случайных цитат с использованием HTML, CSS, JavaScript

Код создает простой «Генератор случайных цитат», который отображает новую случайную цитату каждый раз при нажатии кнопки «Создать цитату».

Вы можете отправить цитату на свой аккаунт в Твиттере, нажав кнопку «Твитнуть».

Живая версия на гит-страницах. Вот так это выглядит и работает.

https://mtapirina.github.io/Quote-Generator/

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12837;image)

Да не назвала бы учебу неприятностями :)

скорее наоборот, соскучилась, устала бить балду..
Даже как то неудобно перед людьми, человеками, что общению с ними предпочитаю (на данном этапе)-общение с учебными пособиями и всяко-разную практику в редакторе кода.

Кстати да, на одном из компов доставшемуся со вторых рук (пользованный  стационарный, докупила к этому блоку монитор)- стояла винда 10.
Ох как же она меня выбесила своеволием и настырностью!
как люди вообще эти наглым обрезком майкрософта пользуются и не сходят с ума?

Удаляю ненужные мне компоненты, а эта сука при каждом запуске ставит мне их вновь!
Скачиваю программы с торрентов, а эта скатина мне все кряки удаляет, не успеваю оглянуться..прям при загрузке.

если отключить Windows Defender Antivirus  и прогу установить - то эта скотина перезагрузившись - мне сжирала уже установленные лицензии(хотя и не все, но адобовские сразу распознала. Я акробат ставила ПДФ читать и собирать)

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

Стало лучше нмного. Иначе ощущение было, что сидишь на выставке или ветрине, и всякие поставщики рекламмы и услуг пялятся на тебя из этих всплывающих окошек.
Ну и программы смогла установить, кряки не слетали.

Но и все равно, полностью отключенная от обновлений, с выключенным антивирем - она повизгивает, что замечен троян и требует "Срочно сделать что нибудь!"

А трояны мне до лампочки, так как работаю я на том компе - с выключенным интернетом.
Только если скачать надо что то - включаю.
Эдакая "песочница", для программ музыкальных, так как все библиотеки у меня на основном компе - все место загружают и не помещаются уже. Плюс уроки, коих тоже более сотни гигов..

А так - разгрузила свой мак, на нем только учеба и работа. А на "песочницу" Винду - рисовалки, музычка, мультипликация и прочие развлечения.

Однако на диске где установлена Винда - оставалось довольно много пустого места, а я давно мечтала разобраться с Линуском.
Ну чисто безопасно ползать по интернету, ну и качать с ютуба нужное в хорошем разрешении и без рекламмы..

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

Так как в Линуксе я полный ноль, а видела ее в последний раз еще в юности, в эпоху общения с хакерами - то решила поставить самую простенькую ее версию, для чайников и с графическим интерфейсом и поддержкой сообщества - Ubuntu

Сначала просто с флешки включала ее, не используя физический диск. Благо 32 гб оператичной памяти - позволяют хоть 3д проги запускать, будь они в комплекте загрузчика операционки.

Я помню как впервые увидела комп знакомого хакера..
Это системный блок с открытыми боками, требухой из шлейфов наружу - и совсем - БЕЗ ЖЕСТКОГО ДИСКА!

В те времена он ставил диск или дискету - и запускал операционку с нее, часто в сейф графикс моде - с минимальными картинками или вообще без них.

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

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

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


И вот только сейчас смогла "осуществить" и это желание и закрыть " камическую дыру", если можно так выразится.

Ну что сказать.. Честно, я ожидала Худшего.
Убунта меня очень порадовала, очень похожа на операционку мака, внешне. Хотя имеет другую немного архитектуру.
Удивило, что все нужные проги оказались в их "магазине", причем попались среди них и те, что на маке или винде - платные - под линукс - выложены бесплатно.. Линусководов использующих графический интерфейс (который смешно называется - Гном!) -- словно неполноценными считают, ну и относятся с каким то душещипательным сочувствием..Отдают свои проги бесплатно..

Да Адоба вы там в шопе не встретите, но на торрентах есть упакованные самоделки.. если кому надо..

Мне же первой радостью в том шопе был VLC player и маленькая программулечка - поиска по ютубу, просмотра без рекламмы в любом нужном разрешении!!! и с возможностью очень быстро закачать..
Хоть 22 часа обучающего видео (уроки -слепленные в одно видео ) в разрешении 4К и с отличным звуком..
Разработчик - индиец какой то..гений!

В общем поставила там бызовый фаервол и все
И красота..
Чисто для фронтэнда - самое оно, самая крутая среда..

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

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

Само собой ни на винде ни на линуксе  - никаких .. личных документаций я не держу.
И в банки не захожу. И ничего не оплачиваю..
Это песочницы..
Но удовольствие от знакомства с Линуксом получила большое.
Учусь на маке, а вот экспериментирую с тем что изучила - на Убунте.
А вин - чисто для игрушек - музыки в основном..
А то в один мой рабочий комп все мои интересы уже не помещались. Разрузила его немного..
Меньше ломанных прог - меньше опасений..
А песочницы на то и песочницы - - развалятся под натиском вирусни - без потерь и сожаления легко переустановлю систему.

Вот такие новости у меня..

В академии кода - мы проходим Тестирование приложений на Джаваскрипт. Ну и создание своих наборов тестов. Честно говоря практически нам еще нечего тестировать, так как веб приложения нас научат создавать после.

Показывать там особо нечего. Ну и немного скучно.

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12845;image)


Гораздо веселее параллельно с тестирование - делать другие уроки, найденные на ютубе, такое добро и совершенно бесплатно!

Анимировать картинки с собачкой.

У урока с собакой - есть продолжение. Будем делать движущийся фон, с параллакс эффектом.

Идея заключается в том, чтобы перемещать фоновые слои с разной скоростью (т. е. чем дальше слой, тем медленнее он движется.

(в конце всех уроков про собаку - обещают 2д игру, платформер.. Ну посмотрим)



Выполнено по уроку "Анимация Спрайтов на чистом (ванильном) Джаваскрипт" на youtube канале Franks laboratory https://www.youtube.com/hashtag/frankslaboratory

Лист спрайтов теневой собаки используется только в учебных целях. Сайт художника: Bevouliin https://bevouliin.com


Веб страница с возможностью выбрать и просмотреть все анимации, которые есть у Теневого Пса:

LivePage https://mtapirina.github.io/Sprite_Animation_Javascript/

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12842;image)

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12844;image)

Параллакс.
Анимация заднего фона для игры
Скорость увеличивается постепенно, если передвигать ползунок вправо.

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12847;image)

Живая веб страница:
https://mtapirina.github.io/Sprite_Animation_Javascript/parallax.html

А это пример уже с моим рисунком фона. Слои нарисованы в стиле пиксель-арт.
Скрипт универсальный, все работает, хотя картинки имеют маленький размер, чем те, которые шли с уроком.

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12848;image)

Шаблон портфолио веб-разработчика. version 1.0
Проект для портфолио на  Codecademy (https://www.codecademy.com/)

HTML CSS SASS JS

Страница содержит 4 раздела:

Стартовая страница (домашняя страница)

Обо мне (динамический индикатор выполнения)

Портфолио (изображения со ссылками на фиктивные действующие проекты)

Контакты (веб-форма и ссылки на социальные сети)

Индикатор выполнения (статус бар прогресса на странице About Me) - обновляется каждый раз при перезагрузке веб-страницы. Он имитирует случайный процент прогресса от 70 до 100. Эта симуляция отображается зелеными полосами на индикаторе выполнения.
Для этого использовала Javascript. А так же для "липкой" панели навигации по сайту.


Поиграться и покрутить кнопочки - можно тут, на "живой версии" веб проекта
https://mtapirina.github.io/portfolio_template_1/

Репозиторий с файлами и кодами проекта посмотреть или скачать можно тут
https://github.com/mtapirina/portfolio_template_1

И еще один мини-проект, за компанию

#Mixed_Messages – Синтаксис JS.

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

Это мини-проект на Node.js, работает только в терминале( в консоли).
А веб вариант - или то, как это можно применять практически в создании веб страниц - я показывала выше в этой теме.


репозиторий проекта
https://github.com/mtapirina/my_quote_generator

А это похожий проект, на веб странице,  я показывала его выше в этой теме
веб страница - https://mtapirina.github.io/Quote-Generator/

Ну и заодно я парикончила курс по SASS.
Проскакали по нему галопом, не сильно вдаваясь в детали, на мой взгляд. Хотя вещь довольно удобная.
Это сопроцессор для более гибкой и удобной работы со стилями, вы пишите в нем, а он автоматом компилирует в CSS style стиль для вашей веб страницы. Удобное использование переменных, и целых отдельных классов, которых нет физически на вашей странице HTML , но которые существуют виртуально, и позже автоматом компилируются с файл стиля, вам даже заморачиваться об этом не надо.
Переменные и классы (миксины и заполнители)- спасают от множественных повторений и дублирования кода, которое неизбежно в CSS.
И хотя не сказать чтоб нас натаскали на все 100%, каждый может использовать именно те опции которые удобны лично ему.
Например какие то булевы операции или даже циклы! - я считаю исполнять в стилях - вычурностями. Ну максимум транзиты или анимацию .
А для более сложных вычислений по имху - удобнее Javascript.
Но думаю кому то лень учить ее, вот они и вымудряют нечто похожее.
Мне показалось - слишком громоздко делать вычисления в описании  стиля - по сути в раскраске.
Она не предназначена для этого.

В конечный вариант проекта - насколько я поняла - папка и файлы SCSS (SASS)- не вкладываются, если конечно вы не намерены позже редактировать проект.
А вот редактировать без этих файлов проект довольно сложно.
Но проект Портфолио например - который является только шаблоном - я редактировать не собираюсь. Так что файлов лишних не загружала.
Оставила чистый CSS стиль, который после компиляции даже читать трудно, не то что там что то править ...

Так что еще один сертификат в кармане.
Сама не знаю на кой они мне.. Ну для коллекции разве что.

Вообще меня нельзя к кодакадемии подпускать.. У меня на нее одержимость развивается быстро..
Даже не знаю, увлечение КК и прочей эзотерикой на это время отходит на какой то очень задний план..
Писать код, это как писать музыку.. Или рисовать.. Тоже своего рода медитация..
Отключаюсь от всего..

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

Пока только фотки для примера.

Анимированный вариант на веб странице - будет позже,  когда коллекция станет побольше.
Тогда можно будет потыкать в них, посмотреть анимацию. Ну и кому интересно - могут порыться в исходном коде CSS.

на скринах - кнопки в обычном состоянии и при наведении мышки (после анимации)


1- 2д плоский градиент
(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12849;image)


2- 3д градиент - кнопка поворачивается и по ней пробегает блеск, словно она стеклянная
(похожа на пуговицу на пальто моей бабушки!)

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12850;image)


3- 3д эффект - плоский цветной квадрат-иконка - открывается как книжка, при наведении мышки

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12851;image)


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

(http://postnagualism.com/Bruja/index.php?action=dlattach;topic=78798.0;attach=12852;image)



ЗЫ--цвета можно изменять на ЛЮБЫЕ.
Тут - главное сами эффекты.
Каждому варианту кнопок можно менять и цвет, и скорость анимации и направление, в какую сторону и на сколько градусов поворачивается или кружится..