Салават Салахутдинов

$str = 'hello \nworld';
$strippedStr = stripcslashes($str);
echo $strippedStr;
// Вывод:
hello 
world

fetch('https://example.com/main.json')
   .then(response => response.json())
   .then(json => {
       // console.log(json);
   })

div#register>a>div.btn {
  float: right;
  color: #ffffff;
  font-size: 1.4em;
  background-color: #acc6e6;
  border-radius: 5px;
  padding: 5px 9px;
  font-family: "Bahnschrift";
  font-weight: 600;
  margin-right: 2%;
  margin-top: 10px;
  transform: translateX(0);
  transition: color 0.5s ease, background-color 0.5s ease;
  -o-transition: color 0.5s ease, background-color 0.5s ease;
  -ms-transition: color 0.5s ease, background-color 0.5s ease;
  -webkit-transition: color 0.5s ease, background-color 0.5s ease;
  -moz-transition: color 0.5s ease, background-color 0.5s ease;
  border: 1px solid #f2f2f2;
}

div#register>a>div.btn:hover {
  color: #acc6e6;
  background-color: #ffffff;
}

div#register>a>div.btn:active {
  transform: translateX(2px);
}

const fetchItems = async () => {
  const data = await fetch('https://faap-app.herokuapp.com/faap/v1/rcvr_board'
  );

  const json = await data.json();
  setItems(json.data);
};

return (
    <div>
        {items && items.map(item => (
            <h1 key={item.id}>{item.subject}</h1>
        ))}
    </div>
);

<section id="portfolio" class="portfolio-slider">
    <div id="portfolio-categories-nav" class="portfolio-categories-nav">
      <button type="button" class="portfolio-categories-nav__item" data-category-id="1">Категория 1</button>
      <button type="button" class="portfolio-categories-nav__item" data-category-id="2">Категория 2</button>
      <button type="button" class="portfolio-categories-nav__item" data-category-id="3">Категория 3</button>
    </div>
    <div class="swiper-container">
      <div class="swiper-wrapper">
        <a href="" class="portfolio-slider-slide swiper-slide" data-categories="[3]">Название</a>
        <a href="" class="portfolio-slider-slide swiper-slide" data-categories="[1,3]">Название</a>
        <a href="" class="portfolio-slider-slide swiper-slide" data-categories="[2]">Название</a>
        <a href="" class="portfolio-slider-slide swiper-slide" data-categories="[2,3]">Название</a>
      </div>
    </div>
    <div class="text-right">
      <button type="button" class="portfolio-slider__prev-btn"><i class="icon-left"></i></button>
      <button type="button" class="portfolio-slider__next-btn"><i class="icon-right"></i></button>
    </div>
  </section>

import Swiper from 'swiper';
function initSwiper(containerSelector) {
  const options = {
    slidesPerView: 2,
    slidesPerColumn: 2,
    slidesPerColumnFill: 'row',
    spaceBetween: 0,
    loop: false,
    autoplay: {
      delay: 8000,
    },
    navigation: {
      nextEl: containerSelector + ' .portfolio-slider__next-btn',
      prevEl: containerSelector + ' .portfolio-slider__prev-btn',
    },
    breakpointsInverse: true,
    breakpoints: {
      768: {
        slidesPerView: 3,
        slidesPerColumn: 2,
      },
      1024: {
        slidesPerView: 4,
        slidesPerColumn: 2,
      },
    },
    threshold: 2,
  };

  return new Swiper(containerSelector + ' .swiper-container', options);
}

function initPortfolio (
  containerSelector = '#portfolio',
  itemsContainerSelector = '#portfolio .portfolio-slider'
) {
  const $categoriesButtons = $categoriesSlickContainer.find(
    '.portfolio-categories-nav__item'
  );
  const $itemsContainer = $(itemsContainerSelector);
  const itemsSwiper = initSwiper(containerSelector);
  const $items = $('.portfolio-slider-slide', containerSelector).clone();

  function activateCategoryButton($button) {
    const categoryId = $button.data('categoryId');
    $categoriesButtons.removeClass('active');
    $button.addClass('active');

    const $newSlides = $items.filter(function() {
      const categories = $(this).data('categories');
      return categories ? categories.indexOf(categoryId) !== -1 : false;
    });

    itemsSwiper.removeAllSlides();
    itemsSwiper.appendSlide($newSlides.toArray());
  }

  if ($categoriesButtons && $categoriesButtons.length) {
    activateCategoryButton($categoriesButtons.first());
    $categoriesButtons.on('click', function() {
      activateCategoryButton($(this));
    });
  }
};

initPortfolio();

<!-- Первый слайдер -->
<div class="primary-slider">
  <ul id="first-slider">
    <li>
        <h3>First Slide</h3>
        <p>Lorem ipsum Cupidatat quis pariatur anim.</p>
    </li>
    <li>
        <h3>Second Slide</h3>
        <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
    </li>
    ...
  </ul>
</div>

<!-- Второй слайдер -->
<div class="secondary-slider">
  <ul id="second-slider">
    <li>
        <h3>First Slide</h3>
        <p>Lorem ipsum Cupidatat quis pariatur anim.</p>
    </li>
    <li>
        <h3>Second Slide</h3>
        <p>Lorem ipsum Excepteur amet adipisicing fugiat velit nisi.</p>
    </li>
    ...
  </ul>
</div>

$(document).ready(function() {
  $("#first-slider").lightSlider();
  $("#second-slider").lightSlider();
});

// первый слайдер
.primary-slider .lSPrev {
  ...
}
.primary-slider .lSNext {
  ...
}
...

// второй слайдер
.secondary-slider .lSPrev {
  ...
}
.secondary-slider .lSNext {
  ...
}
...

const json = "['1', '2', '3']";
const result = JSON.parse(json.replace(/'/g, '"'))

*,
*::before,
*::after {
  box-sizing:border-box;
}