Przemyslaw Serwicki

|
|

React Alicante 2018 and Why You Can’t Miss It Next Year!

Enjoying the sun, tasting delicious food and receiving a huge portion of knowledge about React at a clip? Sounds like a joke, right? There’s nothing funny about it – we’re serious! We experienced all this and much more during the React Alicante 2018 conference in September. We’d like to share our impressions from the conference with you and… our favorite food joints in Alicante!

It all started in 2017. Back then we were using React, Mobx, Redux, and TypeScript in our project, and we had to upgrade our skills. That’s why we were very happy when we found out about the first edition of the React Alicante conference. Sadly, it was a bit too late for us to sign up and handle all the logistics of getting people over there.

We knew that the event created a real WOW effect. So we decided this year we had to go to Alicante. We were attracted by the technologies they planned to cover during the conference. We also wanted to systematize the knowledge that we had gained on our own while working in the project, as well as learn the latest trends in React.

THE JOURNEY BEGINS

“How complicated can it be to go for a conference in a foreign country?” we said to ourselves. And that’s exactly what we did!

At the beginning of June, we bought tickets for the conference that was scheduled for 14–15 September.

There is a direct flight between Wrocław and Alicante with an average flight time of around 3h 10m, so it’s not a very long trip. We booked our seats and started looking for accommodation in Alicante.

We chose Hotel Eurostars Lucentum, which is located in the city center. This was a great choice, because we had a distance of just 1.4 km to the conference venue – the Melia Alicante hotel. We could make it on foot in less than 20 minutes.

Finally, the day arrived. At 2:00 pm we shut down our laptops, took our luggage and left the Synergy Codes office. Our flight went fine, but there was a short (one-hour) delay. Around 9:00 pm we finally landed in Alicante.

After leaving the airport terminal we took the C6 bus going to the city center. It was a 20-minute ride that gave us time to admire the beautiful surroundings.

A beautiful view of Alicante.

Eurostars Lucentrum turned out to be a very nice place. Friendly staff, clean double room, comfortable beds. Perfect for getting a good night’s sleep after a very long day. But first, we had to eat something. Finding a restaurant in Alicante is super easy. We ordered a true must-try dish in this region of Spain – paella with seafood.

It was a long day, but the amazing atmosphere created by all the people on the streets (and some cold beer, of course!) was a perfect ending for it.

DAY 1 – LATEST REACT TRENDS

The day started with an opening and welcome session. A short announcement of upcoming events told us something really interesting – that participants had come from over 30 countries around the world. In addition, the fact that speakers from different countries (not only Spain) would be speaking in English meant that it was going to be a truly international conference.

At the conference venue.

2018 – THE YEAR OF WEB COMPONENTS

Dominik Kundel not only explained why 2018 is the year of web components. He also presented stuff that can be built with web components and introduced to us the topic of building our own shareable components. A lot of information and places worth checking out on the internet after this talk – stenciljs.com and webcomponents.org – a very good starting point if you want to create your own component.

THE LONELY AND DARK ROAD TO STYLING IN REACT BY SARA VIEIRA

It was a funny but also very interesting talk by the frontend developer born in Portugal. She knew how to present stuff so that nobody was bored, not even for a moment. Slides about preprocessors, styled components and different approaches to defining style. All of it interrupted by funny pics full of humor. Good presentation skills combined with knowledge. Sara was one of the conference’s brightest stars.

NEXT GENERATION FORMS WITH REACT FINAL FORM BY ERIK RASMUSSEN

Erik spent this session analyzing a very old and common problem – state management on form. He presented a new library he created by himself called React Final Form.

For us, where we still have forms inside our project that we built without using any library, it was a good time to start thinking about some changes.

THE ABC OF CODED STYLE GUIDES BY HENNING MUSZYNSKI

Henning explained what, exactly, a coded style guide is. He summarized it in a few key points, like live documentation and components rendered and built in isolation.

Some of the important aspects that we kept in mind were:

  • Styleguidist – a component development environment with a living style guide that supports Vue and React,
  • Storybook – a dev environment that allows developers to view different states of each UI component.

TESTING, TESTING, 1, 2, NAN BY GANT LABORDE

Here we learned a lot of about different kinds of testing. Gant mentioned a great testing library called JEST. It’s a wonderful tool, not only for unit tests but also snapshot unit tests. Apart from snapshot unit tests other kinds of tests were discussed – end to end testing with Cypress, performance tests with BenchmarkJS, environment tests with Solidarity, and copy-paste and parametrized chaos tests.

LIGHTNING TALKS

This 45-minute slot contained three presentations. Flavio Copra talked about recomposition using the example of refactoring an AirBnB calendar, Olena Sovyn gave a short talk about chrome extensions, and Javi Velasco highlighted the issue of error handling.

When the lightning talks section was over it was time for some cool VR.

JOURNEY THROUGH VR AND AR WITH REACT BY TOMASZ ŁAKOMY

During this session, Tomasz presented how a great AR and VR experience can be built with a bit of React. He showed us real-world examples of augmented reality, like Pokemon GO or virtual markers around real objects. For virtual reality, Tomasz did a live demo using Samsung Gear VR. It was a short but interesting session packed with technical innovations. If it sounds interesting and you want to learn more, we recommend React-Web-AR and React 360.

A break between sessions at the huge hotel terrace.

THE NEW ERA OF ZERO-CONFIG TOOLS BY ALEX JOVER

During this session we took an exciting journey through a range of tools that were used heavily over the past two years, but today are becoming outdated. Alex also compared different libraries by showing how a project could be configured using some older tools and how it can be done today with the newest solutions. The examples he used here were Karma, Chai, Mocha and Sinon, which we can replace now with just a single tool – Jest.

This session was packed with a lot of tools like Webpack4, JEST, and Prettier that are definitely worth your attention and should be used in real projects.

MY REACT APP IS SLOWWWWW! BEN ILEGBODU

Like usual, since there were a lot of sessions, it got harder and harder to focus as time went by. Thankfully, the electric Ben Ilegbodu woke the audience up with his energetic personality. Really! This guy started his presentation by – no joke! – doing squats together with us!

During his talk, Ben advised us on what to pay attention to while rendering a list in React or importing some modules. It was a brief but very substantive presentation. Ben recommended eight steps to go through in order to improve app performance, which you can read about here.

That was definitely our favorite presentation!

PUSHING REACT NATIVE OUTSIDE THE COMFORT ZONE BY RAUL GOMEZ

I must say that after such a long day it was difficult to find more space in my head for new knowledge, particularly about React Native, which I have no professional experience with. However, Raul Gomez was prepared very well and had a clear goal for his presentation – explaining how we can build a basic music player with React Native. We were exploring particular elements of React Native in detail, arriving at a very nice UI interaction in the end.

The first day of the conference was of such awesome quality that we couldn’t wait for the next sessions!

DAY 2 – REACT NATIVE

COMPONENTS, PATTERNS AND SH*T THAT’S HARD TO DEAL WITH BY MARCO CEDARO

Marco discussed re-usage of components in different use cases when they don’t suit the design. We focused on techniques that can resolve these kinds of problems. Classname injection, ad hoc modifiers, specialized patterns – it’s good to get through all of this and think about how they can solve your architectural problems.

GRAPHQL BOILERPLATES BY MANJULA DUBE

Manjula showed us the Awesome GraphQL Space on GitHub, where we could learn about the React GraphQL project. React, Apollo 2, Prisma and GraphQL – these were the technologies that Manjula walked us through.

TAMING FORMS IN REACT BY JARED PALMER

Jared did some live coding and gave a presentation on how to refactor plain form to a very rich component where submit, validation, and error management is done by a powerful library called Formik. It was the second presentation at this conference related to forms, proof of how this topic is really important in the everyday work we do.

MOBILE NAVIGATION BY BRENT VATNE

Brent gave a great talk to us about React Native Navigation, the React Native package for mobile navigation that works on web, iOS and Android. He did some live coding showing how to manage the issue of navigating between different screens.

I must admit that after this presentation I sorta kinda wanted for a moment to change projects to one that targets mobile and uses React Native under the hood.

MOTION IN REACT BY KAYLIE KWON

Kaylie told us about the range of possibilities available to us in order to handle animations in a React application. She demonstrated how CSS, JS, and third-party libraries can be used in order to get efficient and powerful animation on the screen. Kaylie works for Netflix, so we were getting top tips from a real expert in the field.

LIGHTNING TALKS

Patrick Stapfer presented Facebook’s new programming language, ReasonML. It’s an experimental project where one of the goals is to have something written in Reason, and then use that Typescript as the basis for generating code. Patrick wanted to present his work to us and encourage us to get familiar with it and send him feedback in future.

The second lightning talk was about Redux and testing a Redux store. Anna Gruber presented a Redux app and showed us how to test everything with the addition of a Chai-Redux package (Chai assertion library for testing Redux stores) and the rich possibilities it offers – verification of actions, states, etc.

Thanks to Forbes Lindesay and his presentation titled “Powering Code Reuse with Context and Render Props”, we had a chance to hear how state across different components can be controlled without using a state management library like Redux or Mobx. The React Context API (introduced in React 16) that was presented here lets users share state across the tree of application components.

REACT NATIVE: THE DARK SIDE OF BACKGROUND TASKS BY FERRAN NEGRE

Ferran explained how to manage processes in the background of application on the example of the React Native music player. There were a lot of information about the React Native world and a comparison of the app in background context on Android and iOS. It was another presentation for mobile developers confirming that it’s worth getting deep into this technology.

AN UNKNOWN LAND OF CREATING LIBRARIES BY KAMLESH CHANDNANI

During this session we went through a range of topics. First there was the JavaScript module system and sharing of code across multiple files. Next, Kamlesh focused on Webpack/Rollup, Babel, and their configuration. There were also bundlers, Tree Shaking that prevents unnecessary parts of the application being loaded by frontend, and Lerna – a tool for managing NPM packages. We got the goods on several interesting things we should look at in our projects.

STICK TO COMMON SENSE!

After listening about top trends and best practices, we thought: “Oh, we’re gonna have to rewrite all the apps we’re working on right now because they’re already too old.” But then the closing presentation came – truly uplifting.

Kristijan Ristovski perfectly expressed what we all had in mind – the developer’s obsession to always write the best code using the latest and trendiest technologies. He brought us back down to Earth by saying that the most important thing is to just… stick to common sense. It doesn’t make any sense to rewrite apps every year, because that doesn’t bring business value.

This presentation made us realize that although the IT world is changing so fast, we should be practical in our work and always keep in mind whether a given solution is profitable.

NO BIG NAMES, ONLY PRACTITIONERS

There were no big names at the conference. For some people, this would be its weakness. But, believe us – in the past we’ve taken part in events with “IT celebrities” and we had the feeling that they were simply unprepared for their presentations. What’s more, they were mentioning tools not because of their value or importance but… because of the promotional agreements they had with the producers!

At React Alicante we could listen to real practitioners – people who aren’t associated with React. They use the technology every day, so they could show and recommend solutions that have really worked for them. They also told us what the top tools are now and which technologies will soon go obsolete.

THE CONFERENCE. FOOD AND ATMOSPHERE

Before this event in Spain, we had participated in conferences held in huge exhibition halls. But React Alicante was in a hotel located… right by the beach! It had a huge terrace with a beautiful view of the port. There were tables with hot drinks, juices, and snacks available for us during the breaks. Our favorite “meal” was one sweet croissant, one salty croissant, and a glass of orange juice. An awesome energy boost for the next sessions!

The breaks on the terrace were also a brilliant opportunity to meet other participants and chat with them. Exchanging opinions and comments on frontend stuff with other developers really broadened our horizons quite a bit! For example, we met five developers from different regions of our country. It was great to learn about their working methods!

At many conferences you get your lunch at a buffet, and you have to grab your food quickly to make space for others. At React Alicante, lunch was served in the hotel restaurant (at the conference venue) with a beautiful view of the sea. When we first entered this restaurant, we said: “WOW! What a view!” Another great benefit of the way lunch-time was organized was the opportunity to chat with fellow participants while waiting for our meal.

The food was the best we’ve ever had at a conference! Here’s a few of the delicacies we ate: cake with fish pasta and black garlic, Spanish paella with shrimp, pineapple carpaccio, and lamb steak. And on the last day of the conference they even served delicious cold beer with lunch.

ALICANTE – USEFUL TIPS

You can’t walk more than 20 meters without spotting a great restaurant in Alicante. We’d like to recommend our favorite places to eat.

A must-visit restaurant is Casa Mia Italia. It serves delicious Italian dishes such as lasagna, pasta, gnocchi, and ravioli. There is no fixed menu. Andre, who is both the cook and the owner… serves you personally! Definitely try the starters – delicious bread with cured meat, quesadillas, hams and cheese with olive, and desserts – tiramisu and panna cotta.

La Taberna del Gourmet – there we had the opportunity to try a local fish called Negre. It’s a white salmon that simply melts in your mouth 😊. An absolutely amazing place where the quality of the food is fantastic. We recommend making a reservation or visiting very early in the day just after they open, because later on seats are hard to come by.

La Taverna del Raco del Pla boasts a great atmosphere, with decorations including nice barrels and hams hanging on the walls, and a whole lot of people inside. If you’re eating here, we recommend the paella with seafood. Finger-licking good! With a glass of red wine and a handful green olives to accompany it, we got a fantastic supper.

At Terranosa you can try some exquisite dishes like steak and grilled cod.

And if you need a quick shot of energy, grab some tasty sweet croissants from the La masa de Tomasa bakery.

All pictures taken by Piotr Błaszczyk from Synergy Codes who also took part in the conference.