`What approach to choose for Frontend`a, under PHP without frameworks
<meta name="yandex-verification" content="b48eb87065220426" />
<link rel="apple-touch-icon" sizes="57x57" href="/assets/theme/favicon/apple-icon-57x57.png">
<link rel="apple-touch-icon" sizes="60x60" href="/assets/theme/favicon/apple-icon-60x60.png">
<link rel="apple-touch-icon" sizes="72x72" href="/assets/theme/favicon/apple-icon-72x72.png">
<link rel="apple-touch-icon" sizes="76x76" href="/assets/theme/favicon/apple-icon-76x76.png">
<link rel="apple-touch-icon" sizes="114x114" href="/assets/theme/favicon/apple-icon-114x114.png">
<link rel="apple-touch-icon" sizes="120x120" href="/assets/theme/favicon/apple-icon-120x120.png">
<link rel="apple-touch-icon" sizes="144x144" href="/assets/theme/favicon/apple-icon-144x144.png">
<link rel="apple-touch-icon" sizes="152x152" href="/assets/theme/favicon/apple-icon-152x152.png">
<link rel="apple-touch-icon" sizes="180x180" href="/assets/theme/favicon/apple-icon-180x180.png">
<link rel="icon" type="image/png" sizes="192x192" href="/assets/theme/favicon/android-icon-192x192.png">
<link rel="icon" type="image/png" sizes="32x32" href="/assets/theme/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="96x96" href="/assets/theme/favicon/favicon-96x96.png">
<link rel="icon" type="image/png" sizes="16x16" href="/assets/theme/favicon/favicon-16x16.png">
<link rel="manifest" href="/assets/theme/favicon/manifest.json">
<meta name="msapplication-TileColor" content="#ffffff">
<meta name="msapplication-TileImage" content="/assets/theme/favicon/ms-icon-144x144.png">
<meta name="theme-color" content="#ffffff">
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-8700890447935372"
crossorigin="anonymous"></script>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-N7006N1W94"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-N7006N1W94');
</script>
</head>
<style>
.name-color-A {background:#FF8C7C}
.name-color-B {background:#ff8cc8}
.name-color-C {background:#BE90D4}
.name-color-D {background:#BE90D4}
.name-color-E {background:#1297e0}
.name-color-F {background:#27cbc0}
.name-color-G {background:#2ecc71}
.name-color-H {background:#F5AB35}
.name-color-I {background:#f3825b}
.name-color-J {background:#be8c6b}
.name-color-K {background:#4c5a69}
.name-color-L {background:#657576}
.name-color-M {background:#707070}
.name-color-N {background:#870000}
.name-color-O {background:#9a0038}
.name-color-P {background:#3e005d}
.name-color-Q {background:#003780}
.name-color-R {background:#005b50}
.name-color-S {background:#005c01}
.name-color-T {background:#a84410}
.name-color-U {background:#932210}
.name-color-V {background:#5e2c0b}
.name-color-W {background:#2c3a49}
.name-color-X {background:#d35400}
.name-color-Y {background:#2c3e50}
.name-color-Z {background:#3498db}
.pagination {
display: inline-block;
padding-left: 0;
margin: 20px 0;
border-radius: 4px;
}
.pagination > li {
display: inline;
}
.pagination > li > a,
.pagination > li > span {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #ffffff;
border: 1px solid #dddddd;
}
.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination > li > a:focus,
.pagination > li > span:focus {
z-index: 2;
color: #23527c;
background-color: #eeeeee;
border-color: #dddddd;
}
.pagination > li:first-child > a,
.pagination > li:first-child > span {
margin-left: 0;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination > li:last-child > a,
.pagination > li:last-child > span {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
z-index: 3;
color: #ffffff;
cursor: default;
background-color: #337ab7;
border-color: #337ab7;
}
.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {
color: #777777;
cursor: not-allowed;
background-color: #ffffff;
border-color: #dddddd;
}
.pagination-lg > li > a,
.pagination-lg > li > span {
padding: 10px 16px;
font-size: 18px;
line-height: 1.3333333;
}
.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.pagination-sm > li > a,
.pagination-sm > li > span {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
}
.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
.pagination .without-link {
position: relative;
float: left;
padding: 6px 12px;
margin-left: -1px;
line-height: 1.42857143;
color: #337ab7;
text-decoration: none;
background-color: #ffffff;
border: 1px solid #dddddd;
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
.pagination .page-item:nth-child(1) img {
transform: rotate(180deg);
}
@media only screen and (max-width : 320px) {
.content__item-content {
width: 100% !important;
padding-right: 0px !important;
box-sizing: border-box;
}
}
</style>
<body>
<div class="wrapper">
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-NLLJJ7T"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
<header class="header">
<div class="header__body">
<div class="header__row container">
<div class="header__left">
<div class="header__button"> <span class="header__button-line"></span></div><a class="header__logo lg" href="/"> <img src="/assets/theme/img/logo.png" style="width: 150px;" alt="" draggable="false" loading="lazy"></a>
<a class="header__logo sm" href="index.html">
<img src="/assets/theme/img/logo.png" style="width: 150px;" alt="" draggable="false" loading="lazy">
</a>
</div>
<ul class="header__list lg">
<li class="header__li drop-container">
<button class="drop header__link" type="button">
<div class="icon icon-category"> </div><span>Categories</span>
</button>
<div class="drop__content">
<div class="drop__col">
<!--<a class="drop__link strong border">All Project Questions</a>-->
<a class="drop__link" href="/category/javascript">JavaScript</a><a class="drop__link" href="/category/php">PHP</a><a class="drop__link" href="/category/html">HTML</a><a class="drop__link" href="/category/css">Css</a><a class="drop__link" href="/category/python">Python</a><a class="drop__link" href="/category/wordpress">WordPress</a><a class="drop__link" href="/category/web-development">Web development</a><a class="drop__link" href="/category/linux">Linux</a><a class="drop__link" href="/category/mysql">MySQL</a><a class="drop__link" href="/category/android">Android</a>
</div>
<div class="drop__col">
<a class="drop__link" href="/category/windows">Windows</a><a class="drop__link" href="/category/java">Java</a><a class="drop__link" href="/category/c">C++ / C#</a><a class="drop__link" href="/category/layout">Layout</a><a class="drop__link" href="/category/react">React</a><a class="drop__link" href="/category/ubuntu">Ubuntu</a><a class="drop__link" href="/category/yii">Yii</a><a class="drop__link" href="/category/django">Django</a><a class="drop__link" href="/category/programming">Programming</a><a class="drop__link" href="/category/1c-bitrix">1C-Bitrix</a>
</div>
<div class="drop__col">
<a class="drop__link" href="/category/laravel">Laravel</a><a class="drop__link" href="/category/system-administration">System administration</a><a class="drop__link" href="/category/telegram">Telegram</a><a class="drop__link" href="/category/json">JSON</a><a class="drop__link" href="/category/debian">Debian</a><a class="drop__link" href="/category/postgresql">PostgreSQL</a><a class="drop__link" href="/category/ios">IOS</a><a class="drop__link" href="/category/google">Google</a><a class="drop__link" href="/category/htaccess">Htaccess</a><a class="drop__link" href="/category/windows-server">Windows Server</a>
</div>
<div class="drop__col">
<a class="drop__link" href="/category/git">Git</a><a class="drop__link" href="/category/macos">MacOS</a><a class="drop__link" href="/category/google-chrome">Google Chrome</a><a class="drop__link" href="/category/cms">CMS</a><a class="drop__link" href="/category/woocommerce">WooСommerce</a><a class="drop__link" href="/category/bootstrap">Bootstrap</a><a class="drop__link" href="/category/nginx">Nginx</a><a class="drop__link" href="/category/sql">SQL</a><a class="drop__link" href="/category/unity">Unity</a><a class="drop__link" href="/category/api">API</a>
</div>
</div>
</li>
<li class="header__li"> <a class="header__link" href="#!">
<div class="icon icon-add"> </div><span>Ask </span></a></li>
<li class="header__li"> <a class="header__link" href="leaders.html">
<div class="icon icon-stats"> </div><span>Leaders </span></a></li>
</ul>
<ul class="header__list sm">
<li class="header__list-item"> <a href="#!"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M10.91 12.806A6.964 6.964 0 017 14c-3.863 0-7-3.137-7-7s3.137-7 7-7 7 3.137 7 7a6.97 6.97 0 01-1.18 3.889l2.114 2.113a1.354 1.354 0 01-1.914 1.914l-2.11-2.11zM7 2.477A4.524 4.524 0 0111.523 7 4.524 4.524 0 017 11.523 4.524 4.524 0 012.477 7 4.524 4.524 0 017 2.477z"></path></svg></a></li>
<li class="header__list-item"> <a href="#!"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M8.4 1a.6.6 0 01.6.6V7h5.4a.6.6 0 01.6.6v.8a.6.6 0 01-.6.6H9v5.4a.6.6 0 01-.6.6h-.8a.6.6 0 01-.6-.6V9H1.6a.6.6 0 01-.6-.6v-.8a.6.6 0 01.6-.6H7V1.6a.6.6 0 01.6-.6h.8z"></path></svg></a></li>
</ul>
<div class="header__right">
<form class="header__search search-bar" action="search.html" method="post">
<input name="username" type="text" style="display:none">
<input name="search-question" required minlength="3" class="search-bar__input" type="text" required autocomplete="off" placeholder="Search by questions">
<button class="search-bar__btn" type="submit">
<div class="icon icon-search"> </div>
</button>
</form>
<div class="header__seperator">
<div></div>
</div>
</div>
</div>
</div>
<div class="header__menu">
<div class="header__menu-body container">
<p class="header__menu-title">Categories </p>
<a class="header__menu-link" href="/category/javascript">JavaScript</a><a class="header__menu-link" href="/category/php">PHP</a><a class="header__menu-link" href="/category/html">HTML</a><a class="header__menu-link" href="/category/css">Css</a><a class="header__menu-link" href="/category/python">Python</a><a class="header__menu-link" href="/category/wordpress">WordPress</a><a class="header__menu-link" href="/category/web-development">Web development</a><a class="header__menu-link" href="/category/linux">Linux</a><a class="header__menu-link" href="/category/mysql">MySQL</a><a class="header__menu-link" href="/category/android">Android</a><a class="header__menu-link" href="/category/windows">Windows</a><a class="header__menu-link" href="/category/java">Java</a><a class="header__menu-link" href="/category/c">C++ / C#</a><a class="header__menu-link" href="/category/layout">Layout</a><a class="header__menu-link" href="/category/react">React</a><a class="header__menu-link" href="/category/ubuntu">Ubuntu</a><a class="header__menu-link" href="/category/yii">Yii</a><a class="header__menu-link" href="/category/django">Django</a><a class="header__menu-link" href="/category/programming">Programming</a><a class="header__menu-link" href="/category/1c-bitrix">1C-Bitrix</a><a class="header__menu-link" href="/category/laravel">Laravel</a><a class="header__menu-link" href="/category/system-administration">System administration</a><a class="header__menu-link" href="/category/telegram">Telegram</a><a class="header__menu-link" href="/category/json">JSON</a><a class="header__menu-link" href="/category/debian">Debian</a><a class="header__menu-link" href="/category/postgresql">PostgreSQL</a><a class="header__menu-link" href="/category/ios">IOS</a><a class="header__menu-link" href="/category/google">Google</a><a class="header__menu-link" href="/category/htaccess">Htaccess</a><a class="header__menu-link" href="/category/windows-server">Windows Server</a><a class="header__menu-link" href="/category/git">Git</a><a class="header__menu-link" href="/category/macos">MacOS</a><a class="header__menu-link" href="/category/google-chrome">Google Chrome</a><a class="header__menu-link" href="/category/cms">CMS</a><a class="header__menu-link" href="/category/woocommerce">WooСommerce</a><a class="header__menu-link" href="/category/bootstrap">Bootstrap</a><a class="header__menu-link" href="/category/nginx">Nginx</a><a class="header__menu-link" href="/category/sql">SQL</a><a class="header__menu-link" href="/category/unity">Unity</a><a class="header__menu-link" href="/category/api">API</a>
</div>
</div>
</header>
<main class="main">
<div class="main__body container">
<aside class="sidebar">
<a class="sidebar__title" href="#!">Programming </a>
<div class="sidebar__list">
<a class="sidebar__item " href="/category/javascript">JavaScript </a><a class="sidebar__item " href="/category/php">PHP </a><a class="sidebar__item " href="/category/html">HTML </a><a class="sidebar__item " href="/category/css">Css </a><a class="sidebar__item " href="/category/python">Python </a><a class="sidebar__item " href="/category/wordpress">WordPress </a><a class="sidebar__item " href="/category/web-development">Web development </a><a class="sidebar__item " href="/category/linux">Linux </a><a class="sidebar__item " href="/category/mysql">MySQL </a><a class="sidebar__item " href="/category/android">Android </a><a class="sidebar__item " href="/category/windows">Windows </a><a class="sidebar__item " href="/category/java">Java </a><a class="sidebar__item " href="/category/c">C++ / C# </a><a class="sidebar__item " href="/category/layout">Layout </a><a class="sidebar__item " href="/category/react">React </a><a class="sidebar__item " href="/category/ubuntu">Ubuntu </a><a class="sidebar__item " href="/category/yii">Yii </a><a class="sidebar__item " href="/category/django">Django </a><a class="sidebar__item " href="/category/programming">Programming </a><a class="sidebar__item " href="/category/1c-bitrix">1C-Bitrix </a><a class="sidebar__item " href="/category/laravel">Laravel </a><a class="sidebar__item " href="/category/system-administration">System administration </a><a class="sidebar__item " href="/category/telegram">Telegram </a><a class="sidebar__item " href="/category/json">JSON </a><a class="sidebar__item " href="/category/debian">Debian </a><a class="sidebar__item " href="/category/postgresql">PostgreSQL </a><a class="sidebar__item " href="/category/ios">IOS </a><a class="sidebar__item " href="/category/google">Google </a><a class="sidebar__item " href="/category/htaccess">Htaccess </a><a class="sidebar__item " href="/category/windows-server">Windows Server </a>
</div>
<div class="sidebar__list">
</div>
</aside>
<div class="mid">
<div class="content similar">
<div class="content__header bb-none">
<div class="content__item-wrap">
<div class="content__item p0 b-none">
<div class="content__item-btn dropdown">
<button class="dropdown__btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M8 11.365a1.817 1.817 0 010 3.632 1.817 1.817 0 010-3.632zm0-5.191a1.826 1.826 0 010 3.65 1.826 1.826 0 010-3.65zm0-5.171a1.81 1.81 0 11-.001 3.617A1.81 1.81 0 018 1.003z"></path></svg></button>
<div class="dropdown__content"> <a class="dropdown__item" href="#!"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M7.919 12.563c-.856.567-2.304 1.504-3.757 2.444-.226.19-.542.237-.858.111-.46-.184-.552-.645-.368-1.105l1.197-4.512L.929 6.567c-.174-.141-.295-.353-.295-.565 0-.46.368-.737.736-.737h4.173l1.683-3.928C7.38.987 7.658.793 8 .793h.008c.338.005.614.196.766.544l1.684 3.928h4.172c.368 0 .737.277.737.737 0 .212-.122.424-.296.565l-3.203 2.934 1.197 4.512c.184.46.092.921-.369 1.105-.315.126-.631.079-.858-.111A503.075 503.075 0 018 12.509l-.081.054z"></path></svg><span>Make a leader</span></a><a class="dropdown__item" href="#!"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8 0c4.415 0 8 3.585 8 8s-3.585 8-8 8-8-3.585-8-8 3.585-8 8-8zm.999 11a1 1 0 10-2 0 1 1 0 002 0zm0-6a1 1 0 00-2 0v3a1 1 0 002 0V5z"></path></svg><span>Report </span></a></div>
</div>
<div class="content__item-img dn name-color-D"> <span>D</span></div>
<div class="content__item-content">
<div class="content__item-top sm">
<div class="content__item-top-info">
<div class="content__item-img name-color-D"> <span>D</span></div>
<div class="content__item-top-div"> <a class="content__item-top-name" href="#!">Demigodd</a><span class="content__item-top-p">2019-12-26 14:01:41</span></div>
</div>
</div>
<a class="content__item-top-category" href="/category/frontend">Frontend </a>
<div class="content__item-row dn"> <a href="#!"><b>Demigodd</b>,</a> 2019-12-26 14:01:41</div>
<p class="content__item-title large">What approach to choose for Frontend`a, under PHP without frameworks?</p>
<p class="content__item-detail sm">
Now the most developed front-end frameworks are SPA (React, Angular, Vue). <br>
But if you do not use SPA, then what approach to choose? <br>
How to create a decent website using simple HTML+CSS(Bootstrap)+JS(JQuery)? <br>
Simple HTML+CSS I think will not be enough, some kind of ecosystem is needed to minimize errors, and scalability in the future. So questions arose, for example, which file structure to choose, how to connect dependencies (Bootstrap ..) so that it would be easy to update. <br>
In theory, all I need is to access the PHP Backend, take the data and render in the Front. <br>
What do you advise ? <br>
Preferably a real project on Github. <br>
Thanks in advance.
</p>
<div class="content__action">
<div class="content__action-left">
<a href="https://askmeplz.com/q/what-approach-to-choose-for-frontend-a-under-php-without-frameworks#answer" class="content__form-button lg" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="DY2o8">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path></svg><span>Reply </span>
</a>
<button class="content__action-btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M7.125 14.998c-.003 0-1.516.026-2.28-.635-.825-.714-.845-1.99-.845-1.99V8.961s-.003-1.885.754-2.756c.757-.872 2.431-1.886 2.96-2.614.529-.729.834-1.722 1.672-1.722.837 0 1.239.521 1.239 1.311 0 .377-.349 1.144-.349 2.193 0 .408.34.625.893.625H13c1.263 0 2 .771 2 2 0 .653-.359 1.223-.889 1.524a1.751 1.751 0 01-.876 1.75 1.751 1.751 0 01-.875 1.75 1.75 1.75 0 01-1.735 1.976h-3.5zM3 7.56c0-.724-.276-1.312-1-1.312S1 6.836 1 7.56v6.125c0 .725.276 1.313 1 1.313s1-.588 1-1.313V7.56z"></path></svg></button>
</div>
<div class="content__action-right">
<button class="content__action-btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="QKbwC"><path fill-rule="evenodd" d="M13 2.779C13 1.796 12.204 1 11.221 1H4.779C3.796 1 3 1.796 3 2.779v11.192a1 1 0 001.746.667l2.793-3.123a.618.618 0 01.922 0l2.793 3.123A1.001 1.001 0 0013 13.971V2.779zm-2 .82a.6.6 0 00-.601-.601H5.607A.608.608 0 005 3.606v7.272a.232.232 0 00.402.158l2.146-2.292a.619.619 0 01.904 0l2.151 2.298a.23.23 0 10.397-.157V3.599z"></path></svg></button>
<button class="content__action-btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M8.88 3.37a.3.3 0 00.122-.252A3.001 3.001 0 0115 3a3.001 3.001 0 01-4.951 2.278.292.292 0 00-.366-.017c-.564.407-2.189 1.588-2.649 1.922a.233.233 0 00-.09.234 3.098 3.098 0 01-.001 1.166.234.234 0 00.091.234l2.648 1.924a.295.295 0 00.368-.018A2.978 2.978 0 0112 10a3.001 3.001 0 010 6 3.001 3.001 0 01-2.998-3.118.295.295 0 00-.122-.251l-2.896-2.105a.315.315 0 00-.358-.007A2.968 2.968 0 014 11a3.001 3.001 0 010-6c.599 0 1.158.176 1.627.48.108.072.25.069.355-.007.58-.419 2.392-1.736 2.898-2.103z"></path></svg></button>
</div>
<a href="https://askmeplz.com/q/what-approach-to-choose-for-frontend-a-under-php-without-frameworks#answer" class="content__form-button sm" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="DY2o8"><path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path></svg><span>Answer the question</span></a>
</div>
</div>
</div>
<a name="answer"></a>
</div>
</div>
</div>
<div class="content">
<div class="content__header bb-none">
<p class="content__title dn">Answer the question</p>
<div class="content__form">
<p>In order to leave comments, you need to <a href=вход.html>log in</a></p>
</div>
</div>
</div>
<div class="content">
<div class="content__header bb-none answer-wrapper"> <a class="content__title mb0 answer-title" href="#!">1 answer(s) </a>
<div class="answer">
<div class="content__item-btn dropdown">
<button class="dropdown__btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class=""><path fill-rule="evenodd" d="M8 11.365a1.817 1.817 0 010 3.632 1.817 1.817 0 010-3.632zm0-5.191a1.826 1.826 0 010 3.65 1.826 1.826 0 010-3.65zm0-5.171a1.81 1.81 0 11-.001 3.617A1.81 1.81 0 018 1.003z"></path></svg></button>
<div class="dropdown__content"> <a class="dropdown__item" href="#!"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"><path fill-rule="evenodd" d="M8 0c4.415 0 8 3.585 8 8s-3.585 8-8 8-8-3.585-8-8 3.585-8 8-8zm.999 11a1 1 0 10-2 0 1 1 0 002 0zm0-6a1 1 0 00-2 0v3a1 1 0 002 0V5z"></path></svg><span>Report </span></a></div>
</div>
<div class="answer__header">
<div class="content__item-img large name-color-R"><span>R</span></div><span class="answer__name"><a href="#!">Robur</a>, 2019-12-26 <br/> @Demigodd</span>
</div>
<p class="answer__detail">take a project on react/vue/angular. <br>
Leave the build, cut everything clean from the source, write console.log('hello world') there. remove all unnecessary from the dependencies (leave only the minimum necessary for the build) <br>
That's it, you have a project without frameworks but the JS that generates you is a bundle of what you want. <br>
as they did in the old days - it is no longer necessary. Although if you really want to, then who will forbid you.</p>
<div class="answer__action">
<button class="answer__btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="qWxAZ YJAqn"><path fill-rule="evenodd" d="M7.125 14.998c-.003 0-1.516.026-2.28-.635-.825-.714-.845-1.99-.845-1.99V8.961s-.003-1.885.754-2.756c.757-.872 2.431-1.886 2.96-2.614.529-.729.834-1.722 1.672-1.722.837 0 1.239.521 1.239 1.311 0 .377-.349 1.144-.349 2.193 0 .408.34.625.893.625H13c1.263 0 2 .771 2 2 0 .653-.359 1.223-.889 1.524a1.751 1.751 0 01-.876 1.75 1.751 1.751 0 01-.875 1.75 1.75 1.75 0 01-1.735 1.976h-3.5zM3 7.56c0-.724-.276-1.312-1-1.312S1 6.836 1 7.56v6.125c0 .725.276 1.313 1 1.313s1-.588 1-1.313V7.56z"></path></svg>Like</button>
<button class="answer__btn" type="button">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="qPhqc"><path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path></svg><span>0 </span>comments</button>
</div>
</div>
</div>
</div>
<div class="content similar">
<div class="content__header bb-none">
<span class="content__title mb0 w-svg">
Similar questions
</span>
<div class="content__item-wrap">
<div class="content__item">
<div class="content__item-img name-color-L"> <span>L</span></div>
<div class="content__item-content">
<div class="content__item-row"> <a href="/q/webkit-baseline-middle-any-alternatives">lavezzi1</a><span>2015-10-08 11:23:37</span></div>
<a class="content__item-title similar" href="/q/webkit-baseline-middle-any-alternatives">Webkit-baseline-middle - any alternatives?</a>
<a class="content__item-button" href="/q/webkit-baseline-middle-any-alternatives">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path>
</svg>
<span class="dark">2</span><span class="dn">Reply</span>
</a>
</div>
</div><div class="content__item">
<div class="content__item-img name-color-K"> <span>K</span></div>
<div class="content__item-content">
<div class="content__item-row"> <a href="/q/why-is-the-handler-not-hung-on-the-react-component">KirylLapouski</a><span>2018-02-13 12:18:50</span></div>
<a class="content__item-title similar" href="/q/why-is-the-handler-not-hung-on-the-react-component">Why is the handler not hung on the react component?</a>
<a class="content__item-button" href="/q/why-is-the-handler-not-hung-on-the-react-component">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path>
</svg>
<span class="dark">2</span><span class="dn">Reply</span>
</a>
</div>
</div><div class="content__item">
<div class="content__item-img name-color-T"> <span>T</span></div>
<div class="content__item-content">
<div class="content__item-row"> <a href="/q/float-left-not-working-in-bootsrap">Theory Theory</a><span>2020-04-25 16:55:21</span></div>
<a class="content__item-title similar" href="/q/float-left-not-working-in-bootsrap">Float left not working in bootsrap?</a>
<a class="content__item-button" href="/q/float-left-not-working-in-bootsrap">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path>
</svg>
<span class="dark">0</span><span class="dn">Reply</span>
</a>
</div>
</div><div class="content__item">
<div class="content__item-img name-color-I"> <span>I</span></div>
<div class="content__item-content">
<div class="content__item-row"> <a href="/q/why-isn-t-browsersync-working">ilya77731</a><span>2018-02-24 19:46:18</span></div>
<a class="content__item-title similar" href="/q/why-isn-t-browsersync-working">Why isn't browserSync working?</a>
<a class="content__item-button" href="/q/why-isn-t-browsersync-working">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path>
</svg>
<span class="dark">1</span><span class="dn">Reply</span>
</a>
</div>
</div><div class="content__item">
<div class="content__item-img name-color-F"> <span>F</span></div>
<div class="content__item-content">
<div class="content__item-row"> <a href="/q/how-to-hide-one-block-but-open-another">fregire</a><span>2018-02-25 21:45:11</span></div>
<a class="content__item-title similar" href="/q/how-to-hide-one-block-but-open-another">How to hide one block but open another?</a>
<a class="content__item-button" href="/q/how-to-hide-one-block-but-open-another">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16" class="">
<path fill-rule="evenodd" d="M15 14a1.002 1.002 0 01-1.703.71h-.004l-.003-.01-1.704-1.7H3c-1.104 0-2-.9-2-2V3c0-1.1.896-2 2-2h10c1.104 0 2 .9 2 2v11zM5 6c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1zm3 0c.552 0 1 .45 1 1s-.448 1-1 1-1-.45-1-1 .448-1 1-1z"></path>
</svg>
<span class="dark">2</span><span class="dn">Reply</span>
</a>
</div>
</div>
</div>
</div>
</div>
<div class="content find"> <p class="find__p">Didn't find what you were looking for?</p><a class="find__btn" href="#!">Ask your question</a>
</div>
<div class="find sm">
<p class="find__title">Ask a Question </p>
<form class="find__form" action="#!">
<input class="find__input" type="text" placeholder="Ask your question here">
<button class="find__btn" type="submit">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 16 16" class="nBqR1"><path fill-rule="evenodd" d="M12.696 7.256L9.657 4.217a1 1 0 00-1.415 1.414l1.344 1.344H3.949a1.001 1.001 0 000 2h5.637l-1.344 1.343a1.002 1.002 0 000 1.415c.391.39 1.024.39 1.415 0l3.039-3.04A.993.993 0 0013 7.975a.997.997 0 00-.293-.708l-.011-.011z"></path></svg></button>
</form>
<p class="find__span">731 491 924 answers to any question</p>
</div>
</div>
<aside class="banners">
<p>banners </p>
</aside>
</div>
</main>
</div>
<script src="/assets/theme/js/highlight/highlight.min.js"></script>
<script src="/assets/theme/js/app.min.js?_v=20220404145216"> </script>
<script>hljs.highlightAll();</script>
</body>
</html>