Code Monkey home page Code Monkey logo

atl-fed-10-midterm's Introduction

To work on the following project, clone this repository, then create your own branch and give your name as a branch name. Write all your code in that branch. After you complete the task commit your changes and push the branch to remote server.

You have 15 minutes to read the task and consider how to implement it.

ENG:

  • You have products data in data.js. Get this data and render it on the cards as different products on sale. Each card show info about product (title, content, price, image). You can click the buttons of these cards to add products to your shopping list. In addition to it you have to decide the number of products you want to add to your list. As you add each product to the list, it will render all items on the other side (item title, the number of product) and total amount. Don't lose your time on CSS styling, more important is Javascript. However, good designing will just give you extra points. PS. You should render only products in stock. Rendering images is not required but this case is also give you extra 2 points.
  • Create the page that contains cards and shopping list. Get the data from data.js - 1 point
  • Create cards by DOM elements - 3 points
  • Fill the products related info into cards - 3 points
  • Add functionality to cards which let you increase and decrease the number of products and send them to shopping list - 5 points
  • Create shopping list and render added products to it - 8 points

** Taking each case scenario into consideration give you extra 1 point.

AZE:

  • Data.js faylında məhsulların datası verilmişdir. Həmin datanı işləyəcəyiniz js faylına çəkin və onları kartların daxilində render edərək satışda olan müxtəlif məhsullar kimi göstərin. Hər bir kart məhsul barədə müəyyən məlumatları (başlıq, kontent, qiymət, şəkil) əks etdirəcək. Bu kartlara kliklədikdə həmin məhsulu səbətə əlavə etmək lazımdır. Əlavə olaraq, səbətə əlavə etdikdə məhsulun sayını da göstərmək lazımdır. Hər bir məhsulu əlavə etdikdən sonra səbətdə olan məhsullar yenilənməli və bir kənarda ayrıca "səbətə əlavə olunmuşlar" bölməsində render olunmalıdır. Bu hissədə də məhsul barədə müəyyən məlumatlar (məhsul başlığı, məhsulun sayı) və bütün məhsulların əlavə edildiyi saya görə ümumi qiyməti göstərilməlidir. Dizayn ilə bağlı zaman itirməyə çalışmayın, daha vacib olan Javascript kodlarıdır. Buna baxmayaraq yaxşı dizayn üçün əlavə xallar veriləcək. QEYD: Sadəcə satışda olan məhsulları kartlarda göstərməlisiniz. Məhsulun şəklinin kartda render edilməsi mütləq deyil, lakin bu sizə əlavə 2 bal qazandıra bilər.
  • Kartları və məhsulları əlavə etdiyiniz səbətin yerləşdiyi səhifəni yaradın. Data.js faylından datanı əldə edin. - 1 bal
  • DOM elementləri ilə kartları yaradın. - 3 bal
  • Kartlarda məhsulların məlumatlarını göstərin. - 3 bal
  • Məhsulların sayını azaldıb çoxaldan funksionallığı əlavə edin və bu məlumatları məhsullar əlavə edilən səbətə göndərin. - 5 bal
  • Seçilmiş məhsulların yığıldığı səbəti yaradın və əlavə edilmiş məhsulları burada render edin. - 8 bal

** Yarana biləcək problemlərlə bağlı ehtimalların nəzərə alınması sizə 1 bal qazandıra bilər.

atl-fed-10-midterm's People

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.