Tarea de prueba para front-end

Habré ya tenía 244 artículos profesionales, miles de comentarios sobre malas entrevistas con desarrolladores y muchos programadores descontentos de todo tipo y color. No es que sea el mínimo requerido para una contratación exitosa, pero cuando comienzas a dar pruebas, se vuelve difícil parar.





— , HTML CSS JavaScript. , , . , -.





, . - « .» , , . — , .





? ? ? , , . , .






: «»





: , HTML. JavaScript onclick, .





, , . , , . , JavaScript , ( , , ).






? ? 4 , 2? ?





, - . .









? readme? gulp? , . , , -. : , , .





? — «», .





? ? onclick="" style=""? - , .





? , , . , , , , .





? , , . , , . , «» , .





« .»





HTML

? header/main/footer? ?





? ? — .





? webp ?





? SVG, PNG? SVG ( -) ( , img).





, :





:









  • SVG 





? ? ? 









? , . 





CSS

«» ? , .





Aquí no está clavado, por ejemplo.  Pero te amamos de todos modos
, .

? ? , , .





? - , , font-face montserrat-thin, montserrat-bold montserrat , . font-display unicode-range? , , .









? , .





JavaScript-

, , . HTML, CSS .





? ? ? , «» a b123. , . , .





let a = 1
let b = 2

setTimeout(() => {
    [a, b] = [b, a]
    console.log(a) // 2
    console.log(b) // 1
}, 0)
      
      







? ? , ES5, ES6? , - - .





:









? () , 1 = 1 ()? , , .





? , ? ? . , . , , , , . jQuery , , .





Spoiler
const mailRegEx = /[a-zA-Z0-9]{1}([a-zA-Z0-9-.]{1,})?@[a-zA-Z]{1}([a-zA-Z0-9.]{1,})?[a-zA-Z0-9]{1}.[a-zA-Z]{2,}/;
const PHONEMINLENGTH = 18;

const showErrorIcon = (sth) => {
 const input = sth.target || sth;
 const errorIcon = input.closest('.custom-input').querySelector('.custom-inputerror');
 if (!errorIcon.classList.contains('custom-inputerror--shown')) {
   errorIcon.classList.add('custom-input_error--shown');
 }
};

function IsNumeric(sText) {
   var ValidChars = "0123456789.";
   var IsNumber = true;
   var Char;
   for (i = 0; i < sText.length && IsNumber == true; i++) {
       Char = sText.charAt(i);
       if (ValidChars.indexOf(Char) == -1) {
           IsNumber = false;
       }
   }
   return IsNumber;
}
      
      








. , :





  • https://kenwheeler.github.io/slick/





  • https://glidejs.com/





  • https://swiperjs.com/





Slick jQuery, . .





. glide , swiper . , .





, , .





  • https://github.com/nolimits4web/swiper - 11





  • https://github.com/glidejs/glide - 23





. 2-3 , .





. glide  ~23kb, swiper ~140kb — , glide.





? , 3D- ? swiper, , . ? glide, .






( ).





Proyecto educativo "Barbershop" del curso "HTML y CSS.  Diseño de sitio profesional "
«» «HTML CSS. »

:





  • , ;





  • ;





  • « » , -;





  • .





  • jQuery;





  • JavaScript;





  • Gulp Webpack .





— , .





. , , , .








All Articles