现在写 JS 代码和 CSS 的正确方式是什么？

我是一名后端，不时会接触到 JS 和 CSS 的修改。我是 JQUERY 党，公司的前端只是会做切图，所以最终页面渲染交给了后端。
还好作为后端更多是在维护内部系统，所以对于前端要求并不高。但是呢，在这个年代像我这样写 JS 和 CSS ，总感觉很落伍：

例如某个页面我想绑定这个按钮进行 ajax 交互。我会在对应模板的底部写一段 JQ 代码：

  $(function(){
  	$('...').on('...', function(){
      ...交互的代码  
        
      })
      
      //若干绑定事件
  
  })

而 CSS 得写法，例如某个我要定义某个按钮或者某个元素宽高，我会在公用的样式中这样编写代码：

div.page-button{
   width:100px;
}

当随着代码量的增加，感觉这也得片段代码会慢慢增多，复用性也不高。网上也稍微去了解过各种当前流行前端的写法，感觉用流行的前端框架编写的成本比我这样写更大。至少对于我这位后端开发来说如此。不知道各位公司现在的流行写法是什么？希望不吝指教，谢谢