Повноцінна розробка
Need a full-stack developer who is free for work and not looking to get rich immediately from this project.
This is my test site:
readyhome.ge
the prototype of which I want to create (not referring to design). In the footer, there is Russian language, fill out the questionnaire and go to the configurator.
Here is the description of the site:
User:
Fills in the parameters of the object.
Selects the interior style.
Configures materials and finishing elements by rooms.
Receives a preliminary cost estimate for repairs and engineering systems.
The platform should visually resemble a modern configurator/builder with the logic of an online store.
1. Step-by-step configurator
The configurator consists of 5 stages:
Object parameters
Style selection
Interior configuration
Engineering systems
Result and final cost
At all stages, the following is displayed:
current repair cost
base cost
material cost
engineering
additional options
total amount
2. Stage "Style Selection"
The user selects a ready-made interior style.
Examples:
Scandinavian
Loft
Neoclassic
For each style:
image
name
short description
Styles should be managed from the admin panel.
3. Stage "Interior Configuration"
Main screen of the platform.
Logic
The user selects a room:
living room
bedroom
kitchen
bathroom
studio
After selecting a room, the configurator for materials and elements opens.
4. Material showcase
On the right, a showcase of goods and materials is displayed.
For each product:
image
name
brand
manufacturer
size
color
price
When clicked, the product enlarges in a popup.
Products are displayed by categories:
walls
floor
ceiling
lighting
doors
baseboards
plumbing
radiators
switches, etc.
Each type of room has its own set of categories.
5. Selection logic
The user can:
select material
replace material
disable individual elements
add additional options
When materials are changed, the cost is recalculated automatically.
6. Engineering systems
A separate stage with:
basic engineering package
additional engineering options
Examples:
warm floor
air conditioning
video surveillance
leak protection
smart home
Some options are included in the base cost.
7. Final screen
Displays:
total cost
cost breakdown
selected style
object parameters
list of materials
engineering systems
additional options
Also:
button to submit an application
button to save the calculation
option to send to the manager
8. Admin panel
Need the ability to manage:
styles
products
categories
prices
calculation coefficients
engineering packages
additional options
All main values should be editable without the involvement of a programmer.
For such a configurator, the database should be structured not like a regular site, but like an e-commerce structure + parametric calculator.
Otherwise, when adding materials, formulas, and styles, the system will quickly break down.
Main principle:
divide the system into 5 independent modules
1. user projects
2. materials catalog
3. interior configuration
4. engineering packages
5. calculation
---
1. General architecture of the database
The correct scheme should look like this:
USERS
PROJECTS
PROJECT_ROOMS
PROJECT_BATHROOMS
STYLES
STYLE_ROOMS
STYLE_DEFAULT_MATERIALS
PRODUCTS
PRODUCT_CATEGORIES
PRODUCT_ATTRIBUTES
PROJECT_SELECTED_PRODUCTS
ENGINEERING_PACKAGES
ENGINEERING_OPTIONS
PROJECT_ENGINEERING
PRICE_RULES
PRICE_COEFFICIENTS
This is a modular architecture.
---
2. USERS table
Users of the system.
users
-----
id
name
phone
created_at
A user can have multiple projects.
---
3. PROJECTS table
Main entity.
projects
--------
id
user_id
property_type (apartment / house)
frame_type (white / black)
total_area
balcony_area
balcony_tiles
gas_available
kitchen_type
rooms_count
bathrooms_count
base_price_S
status (draft / calculated / ordered)
created_at
This is the core of the project.
---
4. PROJECT_ROOMS table
Rooms are created dynamically.
project_rooms
-------------
id
project_id
room_type
(living_room
bedroom
studio
kitchen
bathroom
balcony)
area
Example:
Living room — 44 m²
Bedroom — 16 m²
Kitchen — 24 m²
---
5. STYLES table
Three basic styles.
styles
------
id
name
description
preview_image
Example:
1 Scandinavian
2 Loft
3 Neoclassic
---
6. STYLE_DEFAULT_MATERIALS table
Default materials for the style.
style_default_materials
-----------------------
id
style_id
room_type
category_id
product_id
Example:
Scandinavian
room: bedroom
floor: oak laminate
This allows the configurator to be automatically filled.
---
7. PRODUCT_CATEGORIES table
Categories of materials.
product_categories
------------------
id
name
room_scope
Example:
Walls
Accent wall
Floor
Doors
Lighting
Switches
Radiators
Plinth
Cornice
---
8. PRODUCTS table
All products from the hypermarket.
products
--------
id
category_id
name
brand
manufacturer
price
unit
(m2
piece)
image
description
Example:
Oak laminate
$18
m2
---
9. PRODUCT_ATTRIBUTES table
Product characteristics.
product_attributes
------------------
id
product_id
attribute_name
attribute_value
Example:
color
size
thickness
---
10. PROJECT_SELECTED_PRODUCTS table
Products selected by the user.
project_selected_products
-------------------------
id
project_id
room_id
category_id
product_id
quantity
calculated_price
For example:
project 12
room bedroom
floor laminate
price = 620$
---
11. ENGINEERING_PACKAGES table
Basic engineering.
engineering_packages
--------------------
id
name
included
price
Example:
Electrical wiring
included
Leak protection
included
---
12. ENGINEERING_OPTIONS table
Additional options.
engineering_options
-------------------
id
name
price
unit
(piece / project)
Example:
air conditioner installation
$220
---
13. PROJECT_ENGINEERING table
What the user selected.
project_engineering
-------------------
id
project_id
engineering_option_id
quantity
price
---
14. PRICE_RULES table
Calculation formulas.
price_rules
-----------
id
rule_name
room_type
category_id
formula
Example:
floor_laminate
(area * (price + 2))
---
15. PRICE_COEFFICIENTS table
Constants P.
price_coefficients
------------------
id
name
value
Example:
balcony_tile = 75
laminate_underlay = 2
tile_glue = 10
tile_glue_heated = 21
---
16. BASE_PRICE_S table
Base prices.
base_prices
-----------
id
area_min
area_max
price_S
Example:
20-30 = S1
30-40 = S2
40-55 = S3
---
17. How the calculator works
Algorithm:
1 user enters the area
2 the system selects S
3 adds coefficients P
4 adds selected materials
5 adds engineering options
---
18. Why this architecture is correct
It solves three problems.
1. easy to add materials
Without changing the code.
---
2. easy to change formulas
Through the admin panel.
---
3. easy to add new styles
---
19. How the table relationships look
users
↓
projects
↓
rooms
↓
selected_products
↓
products
↓
categories
And separately
engineering
---
20. The most important recommendation
Do not store formulas in code.
Store in the table:
price_rules
Otherwise, in a year the system will become unmanageable.
Recommended project stack (acceptable alternatives can be considered):
Frontend:
React
Next.js
TypeScript
Tailwind CSS
---------
Backend:
NestJS (Node.js)
TypeScript
---------
Database:
PostgreSQL
----------
Storage of material images:
Amazon S3 or Cloudflare R2
----------
Admin panel:
React + ready-made internal CMS or
Strapi (if a quick launch is needed)
-----------
Authorization
JWT
------------
Hosting:
VPS (Hetzner) or
DigitalOcean
-
full-stack разработчик, который свободен для дел и не захочет сразу разбогатеть на этом проекте - 👍👍👍
-
Огооо, лютоо!
-
Какой срок реализации проекта?
-
Актуальні фриланс-проєкти в категорії Javascript та Typescript
Верстка React/Tailwind компонента для друку бланка А4Потрібно поправити UI/UX дизайн та геометрію одного React-компонента (шаблон клінічної карти для друку в PDF) Весь функціонал, масиви даних та логіка вже написані й працюють — потрібна суто косметика, правильні відступи та позиціонування елементів за допомогою Tailwind CSS Стек… HTML та CSS верстання, Javascript та Typescript ∙ 2 години 32 хвилини тому ∙ 23 ставки |
Шукаю досвідченого Full Stack розробника для створення SaaS-сервісу для інтернет-магазинів.Ідея сервісу: Клієнт завантажує посилання на свій товарний фід (XML або CSV). Сервіс автоматично отримує товари, бере їхні фотографії та створює нові рекламні зображення за готовими шаблонами: ціна, знижка, логотип, акційні плашки тощо. Також у сервісі має бути простий редактор… Javascript та Typescript, Веб-програмування ∙ 23 години 43 хвилини тому ∙ 72 ставки |
Розробка WebGL/Three.js сцени з генерацією та експортом 3D (снапшот) з анімованого шейдераОпис об'єкта:Проект являє собою дизайнерський стіл, виконаний у формі реалістичного, глибокого водовороту (центральна воронка, яка плавно переходить з широкої горизонтальної стільниці в тонку витончену ніжку). Суть задачі:Потрібен WebGL / Creative Coding розробник для створення… Javascript та Typescript, Веб-програмування ∙ 1 день 20 годин тому ∙ 29 ставок |
Підтримка та розвиток сайту клінінгової компанії
906 UAH
Шукаю веб-розробника / вебмайстра для довгострокової підтримки та розвитку сайту клінінгової компанії. Сайт: https://donely.ca Про проєкт DoneLy Home Services — компанія з надання послуг прибирання в Канаді, яка активно розвивається та розширює географію роботи. Шукаю… Javascript та Typescript, Веб-програмування ∙ 3 дні 22 години тому ∙ 63 ставки |
Розробка сайту по ТЗ на FramerПотрібно зробити сайт по цим параметрам що в тз https://docs.google.com/document/d/1ODO2C9Krb4AaMiJz9wfbNzWlAyA2FwCCHL8r0biajUY/edit?usp=sharing Називайте реальний рейт на основі цього дизайну HTML та CSS верстання, Javascript та Typescript ∙ 4 дні 23 години тому ∙ 27 ставок |