Coder Social home page Coder Social logo

my-projects's Introduction

Proyektlar Shabloni

Bu repozitoridan foydalanib siz o'z proyektlaringizni bitta joyga yig'ib, foydalanuvchiga sodda UI ko'rinishida taqdim etishingiz mumkin.

web site image

Proyekt react app ko'rinishida qilingan bo'lib, typescript da yozilgan. Va har bir komponenta uchun test lar ham mavjud.

Saytingiz chizib beradigan komponenta App.tsx komponentasi hisoblanadi.

app comp image

Shablonda ishlatiladigan barcha rasmlar formati .png formatda bo'lishi shart. Profil egasi rasmi profileImage papkasi ichida, qilingan proyektlar rasmlari esa projectImages papkasi ichida turishi kerak.

image forders

Shablon foydalanuvchi taqdim etayotgan ma'lumotlar asosida yaratiladi. Bu ma'lumotlar data.tsx faylida turadi.

data.tsx faylida data degan o'zgaruvchi yaratilgan. Bu o'zgaruvchi array ko'rinishida bo'lib, u ikkita elementdan tashkil topgan.

data var

Birinchi element ham array ko'rinishida bo'lib, u to'rtta string elementdan tashkil topgan.

  1. profil egasini ism - familiyasi
  2. profil egasini linkedin manzili
  3. profil egasini github manzili
  4. profil egasini telegram manzili

data[0] element

Ikkinchi element qilingan proyektlar ma'lumotlari uchun ajratilgan. U ham array ko'rinishida bo'ladi. Va bu array elementlari obyekt shaklida bo'lib, har bir obyekt ma'lum proyektlar guruhi uchun bag'ishlangan.

data[1] element

Bu obyekt 2 ta property dan tashkil topgan.

  1. proyektlar guruhi nomi - projectsTitle
  2. shu guruhdagi proyekt ma'lumotlari - projectsInfo

data[1] element

projectsInfo ham array ko'rinishida bo'lib, har bir array elementi obyekt ko'rinishida bo'ladi.

Bu obyekt uchta name, deployPath, sourcePath propertylaridan tashkil topgan. Bu propertylar ham string ko'rinishida bo'ladi.

  1. name - proyekt nomi uchun
  2. deployPath - proyektni ko'rish uchun link
  3. sourcePath - proyekt kodlarini ko'rish uchun link

data[1] element

Siz data o'zgaruvchisini yuqorida aytilgandek to'ldirishingiz, App.tsx komponentasi uchun o'z ishini ustalik bilan qilishiga imkon yaratgan bo'ladi.

1 - Eslatma

profileImage papkasi ichidagi rasm nomi aynan profileImg.png shaklida bo'lishi kerak.

2 - Eslatma

Qilingan proyekt nomi va bu proyektni projectImages papkasidagi unga mos rasm nomi aynan bir xil bo'lishi kerak. Va bu nom defaultProjectImg bo'lishi mumkin emas.

note 2 note 2

3 - Eslatma

projectImages papkasi ichidagi barcha rasmlar nisbati bir xilda bo'lishi talab etilmaydi. Lekin ularni bir xilda olish tavsiya etiladi.

my-projects's People

Contributors

husan-eshonqulov avatar

Stargazers

 avatar

Watchers

 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.