React и JavaScript hints

[3DD]

Сделал небольшую некоммерческую аппликушку для изучающих React и JavaScript в общем. Выдает рандомно краткие hints о вопросе. Если есть ссылка при хинте, можно перейти почитать детально о предмете. Теперь вручную отбираю инфо и вношу в базу. Пополняю базу по JavaScript & React ежедневно. Сделал аппликуху для тренировки своих скилзов: React, AWS Gateway API, Lambda, Dynamo.

https://www.alphaux.com/

Ради прикола и для тестировки системы сделал отдельную категорию "Excuses from work" - уже много лет собираю коллекцию отмазок по работе - типа "машина заглохла, иду пешком. на утреннюю пятиминутку не ждите". Или "болен, жду доставки ФедЭкс и сантехника. По сему буду работать из дому"

[caltrain]

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

[3DD]

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

Это отмазки по работе только Особенно в крупных конторах. Я заметил, что перед праздниками многие сразу начинают "заболевать", посещать зубных, ждать сантехников, авторемонтиников, - и как результат "работать из дома" и тд )

Я еще только сотни две отмазок в базу положил. У меня их несколько тысяч, Есть прямо таки перлы. А по ходу я хочу посмотреть как там будет все скалироваться )
Изначально я хотел поставить на Elastic Beanstalk, но потом посоветовали для начала самое простое: Gateway API/Lambda/Dynamo. Экспериментировал с Amplify CLI чтобы деплоить в S3 бакет (amplify push & amplify publish), но пришел к выводу, что деплоить с помощью Amplify dashboard и с коннектом в bitbucket гораздо проще.
Еще потрахался с Route 53, но поскольку у меня домен не у Амазона, а у Гугла, и Гугла не понимает ANAME, (только CNAME итд) то пришлось повозиться.

Но мне более интереснее наполнить базу хинтами по Джаваскрипту - и для самообразования, и людям помочь.
Щас этих фреймворков развелось как собак не резанных. Я с джаваскриптом вожусь с 98-го года, но такого как в крайние пару лет не припомню

[liamkin]

Щас этих фреймворков развелось как собак не резанных. Я с джаваскриптом вожусь с 98-го года, но такого как в крайние пару лет не припомню

А что произошло? Много новых фреймуорков появилось? Или Яваскрипт как язык изменился?

[caltrain]

Щас этих фреймворков развелось как собак не резанных. Я с джаваскриптом вожусь с 98-го года, но такого как в крайние пару лет не припомню

А что произошло? Много новых фреймуорков появилось? Или Яваскрипт как язык изменился?

а так и есть буквально: по сравнению с 98-м годом то, что называется разработкой на JS сильно изменилось.

[3DD]

Щас этих фреймворков развелось как собак не резанных. Я с джаваскриптом вожусь с 98-го года, но такого как в крайние пару лет не припомню

А что произошло? Много новых фреймуорков появилось? Или Яваскрипт как язык изменился?

Разумеется

Или Яваскрипт как язык изменился?

ES5->ES6->ES7->ES8->ES9->..

Было:

Code: Select all

function blah(a,b){
      return a+b;
}

Стало:

Code: Select all

   const blah = (a,b) => a + b;

Было:

Code: Select all

   var id;
   if(ob.id){
      id = obj.id;
   }

Стало:

Code: Select all

const {id} = obj;

Было:

Code: Select all

function blah(a){
   this.name=a;
}

стало:

Code: Select all

Class blah {
   constructor(a){
      this.name=a;
   }
}

Или:

Code: Select all

function blah(a,b,c,d){
return a+b+c+d;
}

Было:

Code: Select all

console.log(blah(1,2,3,4));

Стало:

Code: Select all

const vals=[1,2,3,4];
console.log(blah(...vals));

Много новых фреймуорков появилось

Просто навскидку from top of my head:
Frameworks and libraries: React, Angular, Vue.js, Ember.js, Meteor, Mithril, Node.js, Express, Koa, Polymer, Aurelia, Backbone, Next, Nuxt, Flux, Redux, React hooks, Three.js, GraphQL, sass, less, css,grid, jQuery, Jest, Mocha, Jasmine, etc, etc, etc.

[VovaK98]

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

Capture.PNG

И след шагом бы неплохо бы expose Web API, тогда можно интегрировать куда угодно. Я бы в свой email service точно интегрировал.

[3DD]

Классный сервис получился, тот что с отмазками. Теперь бы вот ещё бы оно даты текущие использовало, было бы супер
Capture.PNG

И след шагом бы неплохо бы expose Web API, тогда можно интегрировать куда угодно. Я бы в свой email service точно интегрировал.

Теперь бы вот ещё бы оно даты текущие использовало... ..неплохо бы expose Web API - Это пять!

Ну да, собственно можно будет открыть и темплейты для даты/времени/имени. CORS у меня будет открыт для свободного юзания
Я сейчас с бэкендом вожусь, оптимизирую. Сегодня вечером еще сотню отмазок залью свежих в DB

[KVA]

Я сейчас с бэкендом вожусь, оптимизирую. Сегодня вечером еще сотню отмазок залью свежих в DB

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

[3DD]

Я сейчас с бэкендом вожусь, оптимизирую. Сегодня вечером еще сотню отмазок залью свежих в DB

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

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

[VovaK98]

Теперь бы вот ещё бы оно даты текущие использовало... ..неплохо бы expose Web API - Это пять!

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

[3DD]

Теперь бы вот ещё бы оно даты текущие использовало... ..неплохо бы expose Web API - Это пять!

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

Так может сам и напишу
Давай предлагай реквайрментс

З.Ы. я походу воткнул copy to clipboard функцию чтобы копировать отмазки было проще; Щас деплоится и будет доступна

[VovaK98]

Так может сам и напишу
Давай предлагай реквайрментс

Если API, так что-то типа такого:
https://theysaidso.com/api/

Endpoint лишние можно не городить, оставить https://alphaux.com/api
Выдать по заявкам customer guid (api key), и ограничить в сколько-то бесплатных коллов в сутки.
Tags тоже пока ну его.

http://quotes.rest/qod.json

[3DD]

Так может сам и напишу
Давай предлагай реквайрментс

Если API, так что-то типа такого:
https://theysaidso.com/api/

Endpoint лишние можно не городить, оставить https://alphaux.com/api
Выдать по заявкам customer guid (api key), и ограничить в сколько-то бесплатных коллов в сутки.
Tags тоже пока ну его.

http://quotes.rest/qod.json

Окей, спасибо. Добавил себе в Bitbucket проекта эту task.

[3DD]

Пока сделал размер History в 10 записей. Пытаюсь понять насколько это юзфул

[3DD]

Теперь бы вот ещё бы оно даты текущие использовало... ..неплохо бы expose Web API - Это пять!

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

По ходу, народ, предлагайте свои экскьюзы, если есть, я добавлю в базу

[valchkou]

Теперь бы вот ещё бы оно даты текущие использовало... ..неплохо бы expose Web API - Это пять!

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

По ходу, народ, предлагайте свои экскьюзы, если есть, я добавлю в базу

Sick. OOO. EOM

[3DD]

Sick. OOO. EOM

Да!

[3DD]

Сегодня убил пол-дня, чтобы в AWS Lambda & Gateway API сделать так, чтобы и GET в виде ?topic=excuses работал, и docClient.scan тоже работал. А получалось, что работало или одно или другое - или event.queryStringParameters работает, а docClient.scan нет или наоборот, база сканируется, а event.queryStringParameters получается undefined.

Короче Лямбда для Node.js начинается так:

Code: Select all

exports.handler = async (event) => {

поэтому сканировать базу можно как промис:

Code: Select all

   
    try {
        /* scan DB */
        result = await docClient.scan(params).promise();
    }
    catch(ex) {
        result = ex;
    }  

А вот начало не работающей Лямбды (callback не работает почему-то как надо):

Code: Select all

exports.handler = function(event, context, callback) {
..

[3DD]

Добавил топик "Career advice" - пусть будет

[3DD]

Добавил фильтрацию результатов по keywords. Плюс домен перенес на Rout 53 - стало проще на много.
Добавил больше обучающих подсказок по изучению React

[caltrain]

C каждым вопросом getHint оно вызывает getCollect. поправьте в консерватории

[3DD]

C каждым вопросом getHint оно вызывает getCollect. поправьте в консерватории

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

За пару дней недавно немного набросал простейший фронт-энд в Material-UI. Заодно сделал рефакторинг клиентской части: разделил presentation components и логические components, для учебы и ради разнообразия выкинул Redux и сделал, чтобы работало с Context API, Hooks.
Добавил фильтрацию контента по keywords

По AWS бэкенду: сделал оптимизацию по совету знакомого AWS архитектора:

DynamoDB:
1. В Lambda заменил 'scan' на 'query' базы данных, оптимизировал query params
1. В Dynamo заменил мои несколько таблиц на одну, ибо оплата берется за Indexes за каждую таблицу
2. При моем никаком траффике также в Dynamo для Capacity поставил Read capacity units: 5, Write capacity units: 1
В итоге вместо $16+ в месяц, теперь плачу $1.95. Мелочь, а приятно ).
Кстати, этот AWS архитектор проникся идеей выдачей Hints по разным предметам, я ему сделал на моем S3 отдельный bucket куда он начал закидывать свои хинты по AWS и AWS Security c ссылками на видео на Ютубе.

Щас в процессе: поставить доступ к основному контенту (он пока еще не паблик) через Cognito UserPool /Lambda Authorisers / Resource policy / AWS WAF, etc.

Incognito доступ останется, как сейчас, к ограниченной части контента - пара сотен Hints по каждому топику

[3DD]

Добавил My Hints - можно собирать понравившиеся хинты в корзину. React Context API + hooks помогают неплохо так оптимизировать код

[3DD]

dup